如何显示base64编码的pdf?

dny*_*war 18 html javascript embed pdf base64

我必须在新标签中显示base64 pdf.我正在使用下面的代码

 var windo = window.open("", "");  
 var objbuilder = '';
 objbuilder += ('<embed width=\'100%\' height=\'100%\'  src="data:application/pdf;base64,');
 objbuilder += (fileData);
 objbuilder += ('" type="application/pdf" />');
 windo.document.write(objbuilder); 
Run Code Online (Sandbox Code Playgroud)

它在FireFox中工作,而不是在Chrome和IE中工作.我甚至尝试使用标签,但输出相同,在FF中工作,但在Chrome和IE中没有.

我查看下面的JsFiddles,因为它在FF中工作但在Chrome中没有,

http://jsfiddle.net/yLx2W/

http://jsfiddle.net/yLx2W/1/

我的Chrome版本是:版本54.0.2840.99米

FireFox版本:49.0.2

有任何人有任何想法,请分享.

提前致谢

小智 12

对于那些仍然无法做到的人,我发现这个在别人的回答,但我不记得谁...

var objbuilder = '';
objbuilder += ('<object width="100%" height="100%" 
data="data:application/pdf;base64,');
objbuilder += (myBase64string);
objbuilder += ('" type="application/pdf" class="internal">');
objbuilder += ('<embed src="data:application/pdf;base64,');
objbuilder += (myBase64string);
objbuilder += ('" type="application/pdf"  />');
objbuilder += ('</object>');

var win = window.open("#","_blank");
var title = "my tab title";
win.document.write('<html><title>'+ title +'</title><body style="margin-top: 
0px; margin-left: 0px; margin-right: 0px; margin-bottom: 0px;">');
win.document.write(objbuilder);
win.document.write('</body></html>');
layer = jQuery(win.document);
Run Code Online (Sandbox Code Playgroud)

这样我们就可以在新标签页中打开pdf.


Ale*_*xis 9

它可以与您可以使用的Chrome一起使用

<iframe src="data:base64...">

<object data="data:base64...">

我在IE中也遇到了同样的问题:无法显示带有base64字符串的pdf 。

我必须在服务器上生成临时文件才能使用IE显示它们,他只能通过使用路径来显示现有文件

您仍然可以使用JS库将pdf显示为PDF.js

  • 我试过 Object 和 iframe 也试过 URIdata,但不能在 Chrome 中工作你可以在下面的 JSFiddles 中看到,http://jsfiddle.net/yLx2W/ http://jsfiddle.net/yLx2W/1/ (2认同)

小智 7

当上述答案由于大小限制而不起作用时,您可以尝试这个解决方案,当我尝试在 Chrome 中将 16+ 页 PDF 从 Base64 转换回 PDF 时,它对我有用。

修复方法是将 base64 转换回二进制,将其打包到 Blob 中,然后将 iframe 的“src”设置为指向该 Blob 的 Blob-URI。

var base64 = ("yourBase64StringVariable")
const blob = base64ToBlob( base64, 'application/pdf' );
const url = URL.createObjectURL( blob );
const pdfWindow = window.open("");
pdfWindow.document.write("<iframe width='100%' height='100%' src='" + url + "'></iframe>");

function base64ToBlob( base64, type = "application/octet-stream" ) {
  const binStr = atob( base64 );
  const len = binStr.length;
  const arr = new Uint8Array(len);
  for (let i = 0; i < len; i++) {
    arr[ i ] = binStr.charCodeAt( i );
  }
  return new Blob( [ arr ], { type: type } );
}
Run Code Online (Sandbox Code Playgroud)

这个答案的原始来源 -使用 javascript 打开 base64 编码的 pdf 文件。文件大小大于 2 MB 的问题