NodeJS: serve png generiert von node-canvas

Question

Ich möchte eine .png-Datei mit node-canvas erstellen und bereitstellen. Mit Express, ist das, was ich bisher getan haben:

draw_badge.js

function draw() { 
    var Canvas = require('canvas'), 
     Image = Canvas.Image, 
     canvas = new Canvas(200, 200), 
     ctx = canvas.getContext('2d'); 

    ctx.font = '30px Impact'; 
    ctx.rotate(0.1); 
    ctx.fillText('Awesome!', 50, 100); 

    return canvas; 
} 

module.exports = draw; 

badge.js

var express = require('express'); 
var router = express.Router(); 
var draw = require('../lib/draw_badge.js'); 

router.get('/show', function (req, res, next) { 
    res.setHeader('Content-Type', 'image/png'); 
    res.end(draw()); 
}); 

module.exports = router; 

Aber wenn ich gehe auf die Route in meinem Browser Ich sehe keinen Png. Mein Verständnis von Knoten ist nicht fest genug, um zu verstehen, was vor sich geht. Kann mir jemand in die richtige Richtung zeigen?

Answer 1

Versuchen Sie, diese i n badge.js:

var express = require('express'); 
var router = express.Router(); 
var draw = require('../lib/draw_badge.js'); 

router.get('/show', function (req, res, next) { 
    res.setHeader('Content-Type', 'image/png'); 
    draw().pngStream().pipe(res); 
}); 

module.exports = router; 

der Hinweis Code draw().pngStream().pipe(res);

Es wird ein PNG-Stream von Ihrem Leinwand zu erhalten und wird Rohr diesen Strom in den Antwortstream. Auf diese Weise müssen Sie nicht res.end() anrufen, denn wenn Ihr PNG-Stream endet, wird auch Ihr Antwortstream beendet.