expressjs中间件中的“res.sendFile”和角度客户端中的“ng-src”组合不起作用

我正在尝试使用头像图片创建用户配置文件;我已经使用Muller成功上传了头像图片;现在我正在尝试提供编辑配置文件的选项;作为编辑的一部分，我必须在客户端显示头像图片;我已经在中间件中编写了一个服务来使用res.sendFile返回头像图像;expressjs中间件中的“res.sendFile”和角度客户端中的“ng-src”组合不起作用

中间件控制器：

exports.readAvatar = function(req, res) { 
    if (req.user) { 
     res.sendFile(path.resolve(__dirname + "/../../uploads/" + req.user.avatar)); 
    } 
}

我甚至测试从一个浏览器在这种服务，并成功地工作，但是当我尝试使用纳克-src的与数据的URL象下面显示该化身的服务的响应时，它不工作。

客户端控制器：

Users.avatar($routeParams.userId).then(function(data) { 
    $scope.avatar = "data:image/jpeg;base64,"+data; 
}, function(errorResponse) { 
    $scope.error = errorResponse.message 
});

HTML：

<img data-ng-src="{{avatar}}" >

当我一派，我发现res.sendFile被实际发送字节流;所以我试图将其转换为字符串，然后对转换后的字符串进行编码，并在ng-src中使用此编码字符串，但无济于事。任何帮助将不胜感激/

来源

2017-08-06 Tech Junkie

什么是您的数据包含哪些内容？它可能必须是data.data – Vivz

@Vivz，数据包含res.sendFile返回的字节流;数据如下所示：“Resource {0：” “，1：” “，2：” “，3：” “，4：”“，5：”“，6：”J“，7：”F“，8：”I“，9：”F“，10：”..“索引在那里直到68889 –

将路径传递给头像变量中的图像文件 – Vivz

您必须将正确的路径值传递到ng-src。

Users.avatar($routeParams.userId).then(function(response) { 
    //capture whatever is necessary to show image 
    $scope.user=response.data; 
}, function(errorResponse) { 
    $scope.error = errorResponse.message 
});

HTML

<img ng-src="https://stackoverflow.com/users/{{user._id}}/avatar">

欲了解更多信息：https://docs.angularjs.org/api/ng/directive/ngSrc

来源

2017-08-06 08:53:38 Vivz

expressjs中间件中的“res.sendFile”和角度客户端中的“ng-src”组合不起作用

回答

相关问题