Question

我目前有一个大的base64图像uri（通过外部JS脚本接收）并希望将其嵌入到HTML页面中。我在本地成功完成了此操作，但现在它从另一个地方拉出它似乎不起作用，它加载部分图像然后说“图像损坏或截断。由于长度，此笔记中的URI被截断”。这只发生在<img>标记和使用<canvas>，是否有任何方法可以从uri加载大图像？或者从base64字符串显示图像的另一种方法？

没有意义的是，如果我将base64字符串指定为javascript变量，它可以正常工作，但是当我将它作为变量包含在外部脚本中时，它会产生此错误。分解字符串然后将其重新组合在一起可以解决这个问题吗？

Answer 1

您不应该将数据网址用于大文件。

您可以尝试使用以下javascript函数将base64网址转换为blob对象，将blob对象转换为临时blob网址：

function dataurlToBlobUrl(url){
  var parts = url.split(',',2);
  var mime = parts[0].substr(5).split(';')[0];
  var blob = b64toBlob(parts[1],mime);
  return URL.createObjectURL(blob);
}

这里的b64toBlob功能： https://stackoverflow.com/a/16245768/5406901

请确保使用＆＃34; URL.revokeObjectURL＆＃34;每当你不再需要blob url时。

如何使用数据uri嵌入大图像

1 个答案: