nodejs 如何读取远程的图片并显示出来?
发布于 13 年前 作者 vfasky 32342 次浏览 最后一次编辑是 8 年前

现在需要这样一个功能: 通过 GET 参数 “url” , 读取图片并显示图片

我现在的代码是:

var http = require('http');
var url  = require('url');
http.createServer(function (req, res) {

    var params = url.parse( req.url , true );

    var IMGS = new imageServer( http , url);

    IMGS.http( params.query.url  , function( data ){
    	res.writeHead(200, {"Content-Type": data.type}); 
    	var img = new Buffer(data.base64, 'base64').toString('binary');
    	res.end( img );
    	console.log(data.base64);
    });

}).listen(80);



var imageServer = function( http , url ){
	var _url  = url;
	var _http = http;

	this.http = function(url , callback , method){
		method      = method || 'GET';
		callback    = callback || function(){};
		var urlData = _url.parse(url);
		var request = _http.createClient(80 , urlData.host).
		                    request(method, urlData.pathname, {"host": urlData.host});

		request.end();

		request.on('response', function (response)
		{
			var type = response.headers["content-type"],
			    body = "";

		    response.setEncoding('binary');
		    response.on('end', function () {
		        var base64 = new Buffer(body, 'binary').toString('base64');
		        var data = {
		        	type   : type ,
		        	base64 : base64 
		        };
		        callback(data);
		        
		    });
		    response.on('data', function (chunk) {
		        if (response.statusCode == 200) body += chunk;
		    });
		});

	};
};

在终端可以看到base64编码后的数据 , 但浏览器只显示空白的图片. 求解

3 回复

你用浏览器调试看看content-type是什么?

事例:

http://127.0.0.1/?url=http://pic002.cnblogs.com/images/2011/26621/2011012811490365.png

在终端查看, 或用firebug 查看. Content-Type 都是 image/png

找到问题

//不能为 res.end(); 输出二进制数据

更改后的代码为:

var http = require('http');
var url = require('url');
http.createServer(function(req, res) {

    var params = url.parse(req.url, true);

    var IMGS = new imageServer(http, url);

    IMGS.http(params.query.url, function(data) {
        res.writeHead(200, {"Content-Type": data.type});
        res.write(data.body, "binary");
        res.end();
    });

}).listen(8124);

var imageServer = function(http, url) {
    var _url = url;
    var _http = http;

    this.http = function(url, callback, method) {
        method = method || 'GET';
        callback = callback ||
        function() {};
        var urlData = _url.parse(url);
        var request = _http.createClient(80, urlData.host).
        request(method, urlData.pathname, {
            "host": urlData.host
        });

        request.end();

        request.on('response', function(response) {
            var type = response.headers["content-type"],
                body = "";
            response.setEncoding('binary');
            response.on('end', function() {
                var data = {
                    type: type,
                    body: body
                };
                callback(data);

            });
            response.on('data', function(chunk) {
                if (response.statusCode == 200) body += chunk;
            });
        });

    };
};
回到顶部