从API消耗图像并在流星的浏览器中显示它

时间:2016-03-03 20:39:19

标签: meteor iron-router

我有一个返回图片的API,想在浏览器上显示图片。我正在使用iron:router包。在客户端用户单击基本上是服务器端iron:route的链接。该路由调用API,并应在浏览器上显示API的响应。

客户js: -

Template.images.events({
'click .image': function (event, template) {
event.preventDefault();
var docId = $(event.target).attr('data-docId');
var imageType = "raw";
var param = {"docId":docId,"imageType":imageType};
params = 'width=' + window.innerWidth;
params += ', height=' + window.innerHeight;
params += ', top=0, left=0'
params += ', fullscreen=yes';
var win = window.open("/Image/?param=" + encodeURIComponent(Base64.encode(JSON.stringify(param))), "_blank", params);
}
});

铁:路线: -

Router.route('/checkImage', function () {
var decoded = Base64.decode(decodeURIComponent(this.params.query.param));
var param = JSON.parse(decoded);
var docId = param.docId;
var content="";
Meteor.call('imageApi', docId, imageType, function (error, result) {
if (error) {
content = "";
} else
content = new Buffer(result);
});

    if (content == "") {
        this.response.writeHeader('200', {
            'Content-Type': 'image/jpeg',
            'Content-Disposition': "inline",
            'Access-Control-Allow-Origin': '*'
        });
        this.response.write('<html><body><p>No content for image found.</p></body></html>');
        this.response.end();
    }
    else {
        this.response.writeHeader('200', {
            'Content-Type': 'image/jpeg'
                'Content-Disposition': 'inline; filename=image.jpg'
        });
        this.response.write(content);
        this.response.end();
    }
}, {where: 'server'});

服务器方法: -

imageApi: function (docId, imageType) {
var url = "API url with the paramters ";
var response;
try{
response = HTTP.call('GET', url, {
headers: {"Content-Type": "image/jpeg"},
responseType: "buffer"
});
}catch (error) {
logger.error("imageApi - Exception in image API " + error);
return false;
}

            if (response.statusCode == 200) {
                return new Uint8Array(response.content);
            }
            else {
                logger.error"imageApi - Response issue: " + response.statusCode);
                return "";
            }
            return "";
        }

我无法在浏览器上显示图像数据。你认为这种方法有什么不对,或者如果有另一种方式来渲染图像。

0 个答案:

没有答案