在我的控制器中,我调用一个返回承诺的服务
var onComplete = function(data) {
$scope.myImage = data;
};
在我的服务中,我通过将 url 直接传递给图像本身来调用以获取图像:
return $http.get("http://someurl.com/someimagepath")
.then(function(response){
return response.data;
});
所有调用均成功,response.data 似乎保存在内部图像中:
����JFIF��;CREATOR: gd-jpeg v1.0 (using IJG JPEG v80), quality = 90
��C
��C
����"��
���}!1AQa"q2���#B��R��$
尽管我不确定它是否真的有效,因为我在显示它时遇到了麻烦。我已经尝试过(在index.html内)
<img ng-src="{{myImage}}">
and
<img ng-src="{{myImage}}.jpeg">
and
<img ng-src="data:image/JPEG;base64,{{myImage}}">
有想法吗?
是否可以从 $http.get 返回实际图像并将其响应转换回图像(jpeg 等)
Thanks!
这些方法似乎都不完整,这是一个完整的解决方案:
$http({
method: 'GET',
url: imageUrl,
responseType: 'arraybuffer'
}).then(function(response) {
console.log(response);
var str = _arrayBufferToBase64(response.data);
console.log(str);
// str is base64 encoded.
}, function(response) {
console.error('error in getting static img.');
});
function _arrayBufferToBase64(buffer) {
var binary = '';
var bytes = new Uint8Array(buffer);
var len = bytes.byteLength;
for (var i = 0; i < len; i++) {
binary += String.fromCharCode(bytes[i]);
}
return window.btoa(binary);
}
然后我就可以直接使用它了:
<img data-ng-src="data:image/png;base64,{{img}}">
要转换的函数数组缓冲区 into base64是直接取自ArrayBuffer 转 base64 编码的字符串 https://stackoverflow.com/questions/9267899/arraybuffer-to-base64-encoded-string
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)