在html View 中，图片是这样显示的:
<img ng-src="{{element.image.url}}">
element.image.url 指向一个 url，如:/rest_api/img/12345678。
这工作正常，显示图像。
现在，我添加身份验证:
在用户通过身份验证之前，每个资源都会响应 HTTP 错误 401，图像也是如此。当身份验证成功时， token 将放置在自定义 header 中并随每个 $http 请求一起发送，从而允许访问资源:
$http.defaults.headers.common['Authorization'] = token;
这对于加载了 $resource 的 Json 文件工作正常。但图片的直接链接在认证后仍然是 401。
如何调用带有自定义标题的图片？
或者关于我应该如何做的任何建议。
最佳答案
如前所述here你可以使用 angular-img-http-src ( bower install --save angular-img-http-src 如果您使用 Bower )。
如果你看the code , 它使用 URL.createObjectURL 和 URL.revokeObjectURL 这是still draft 2016 年 4 月 19 日。所以 look if your browser supports it .
为了使用它，声明'angular.img'作为对您的应用程序模块 ( angular.module('myapp', [..., 'angular.img']) ) 的依赖，然后在您的 HTML 中您可以使用 http-src <img> 的属性标签。
在您的示例中，它将是:<img http-src="{{element.image.url}}">
当然，这意味着您已经声明了一个interceptor。使用 $httpProvider.interceptors.push添加您的自定义 header ，或者您已经使用 $http.defaults.headers.common.MyHeader = 'some value'; 为每个请求静态设置 header
关于javascript - Angular http : how to call images with custom headers?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21613534/