八位字节流到 PNG答案

【问题标题】：Octet-stream to PNG八位字节流到 PNG
【发布时间】：2017-10-24 22:52:18
【问题描述】：

如何将 BLOB 数据：application/octet-stream;base64 转换为 data:image/png;base64？

图像仍然显示，但浏览器不允许我通过右键单击在新标签中打开图像。

$http({
    url: image,
    responseType: 'blob'
}).then((resp)=>{
    var reader = new FileReader();
    reader.onload = function(){
        $scope.model.view.image = reader.result;
    };
    reader.readAsDataURL(resp.data);
});

【问题讨论】：

result.replace('data:application/octet-stream', 'data:image/png') ?
哈哈，绝对不是
为什么不呢？ jsfiddle.net/cb78q272
看起来被替换了，但我需要一个更清晰的方法，而不是让浏览器在那个长结果中找到一个模式。要连续运行此操作，浏览器可能会出现 LAG（如我的控制台），但非常感谢！ :)

标签： javascript angularjs

【解决方案1】：

不要使用 base64，如果它是一个很长的 url 会出现问题...而不是使用 URL.createObjectURL

window.URL = window.URL || window.webkitURL

$http({
  url: image,
  responseType: 'blob'
}).then(blob => {
  // change the type
  blob = new Blob([blob], {type: 'image/png'})
  $scope.model.view.image = URL.createObjectURL(blob)
})

【讨论】：

是的，它运行良好且快速。但是“在新标签中打开图像”选项仍然不起作用，只有当我将网址粘贴到新标签中并按 Enter 时。我会尝试找到解决它的方法。谢谢你:)