如何将图像提供给客户端 nodejs 和 Angular答案

【问题标题】：How to serve images to client nodejs and angular如何将图像提供给客户端 nodejs 和 Angular
【发布时间】：2016-12-26 19:43:12
【问题描述】：

我正在尝试将 .jog 图像发送给客户端，但我失败了。

app.get('/image', function(req, res){;


res.sendfile(path.resolve(path.resolve(__dirname,'/Imagepath/image.jpg")));

});

在我的角度方面

  $http({
    method:'GET',
    url:'/image',
  }).then(function (response){
    $scope.image= response.data;


  })


<img id="imgid" ng-src="{{image}}" width="500" height="400"/>

问题是响应是一些二进制数据。我怎样才能让它向我发送可以显示在 img src 上的数据。如何在客户端的服务器文件夹中显示图像？谢谢。

【问题讨论】：

标签： angularjs node.js image get

【解决方案1】：

除非您需要将图像作为数据发送（例如动态生成），否则您可以将图像的路径设置为您的 src。

假设您使用的是 express.js，那么您可以让它将您的图片作为静态内容提供：http://expressjs.com/en/starter/static-files.html

app.use(express.static('public'));

并且图像存储在public/images/image.jpg，您的角度代码可以将图像加载为：

$scope.image = "/images/image.jpg"

<img id="imgid" ng-src="{{image}}" width="500" height="400"/>

【讨论】：

【解决方案2】：

可以理解，<img> 标签不支持从二进制文件中获取通过属性，所以你必须看看另一个解决方案。

您可以尝试在客户端将二进制编码转换为 Base64 边用 TypedArrays 连同 btoa 功能。然后你就可以使用
<img ng-src="data:image/JPEG;base64,{{myImage}}">

How to return image from $http.get in AngularJS的回答

所以本质上你需要将response.data 转换为base64，然后将其分配给$scope.image。之后，您可以使用上面引用的 img 标签显示它。

【讨论】：