【问题标题】:How to show Base64 image on browser's new tab?如何在浏览器的新标签页上显示 Base64 图像?
【发布时间】:2020-05-21 13:05:23
【问题描述】:

我有 Base64 编码的图像作为响应,如何使用 js 在浏览器的新选项卡中显示该图像?任何人都可以提出解决方案。谢谢

 success: function (base64Image) {


         }

【问题讨论】:

标签: javascript jquery image browser base64


【解决方案1】:

假设你要获得一张 GIF 图片:


// Display a base64 URL inside an iframe in another window.
function debugBase64(base64URL){
    var win = window.open();
    win.document.write('<iframe src="' + base64URL  + '" frameborder="0" style="border:0; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%;" allowfullscreen></iframe>');
}

success: function (base64Image) {

    // e.g This will open an image in a new window
    debugBase64("data:image/gif;base64," + base64Image);

    // you can try with this base64 (it is a red dot)
    // debugBase64("data:image/gif;base64,R0lGODdhAQABAPAAAP8AAAAAACwAAAAAAQABAAACAkQBADs=");

}

否则,只需将 data:image/gif; 更改为您需要的正确 MIME 类型即可。

你可以在这里找到完整的列表https://www.freeformatter.com/mime-types-list.html

我发现并且我刚刚从https://ourcodeworld.com/articles/read/682/what-does-the-not-allowed-to-navigate-top-frame-to-data-url-javascript-exception-means-in-google-chrome尝试了这个解决方案

【讨论】:

  • OP 询问 “在浏览器新标签中” - 你不能在 url 中使用 data:,但有办法解决它
  • 这里是:stackoverflow.com/a/61889193/2181514(但没想到你会发现 :))
  • 感谢您的回复!但我的文件不是 pdf 而是图像。 @freedomm-m
  • 当我使用 window.open("data:image /gif;base64," + base64Image) @FrancescoOrsi
  • 其他人可能找到了解决方案ourcodeworld.com/articles/read/682/…
猜你喜欢
  • 2020-08-16
  • 2013-11-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-06-15
  • 2012-03-31
  • 2023-03-23
  • 2016-01-26
相关资源
最近更新 更多