Chrome打开PDF报错:Not allowed to navigate top frame to data URL
var pdf = "data:application/pdf;base64," + data;
window.open(pdf);
在Chrome使用window.open()打开pdf报错:
Not allowed to navigate top frame to data URL: data:application/pdf;base64,JVBERi0xLjMKMyAwIG9iago8PC9UeXBlIC9QYWdlCi9QYXJlbnQgMSAwIFIKL1....
原因分析
Chrome 60 开始禁止页面使用data:url的方式跳转导航,禁止data:url导航的使用包括:
- <a href="data:xxxxx"> 点击跳转
- window.open(“data:xxx”)
- window.location="data:xxx"
对于使用data:url直接来加载数据的场景不会禁止,如
- <img src="data:xxx" />直接加载图片
- <iframe src="data:xxx"
之所以禁止页面使用dta:url的方式跳转导航,是由于data:xxx协议存在安全问题,编码的url可能会被包含了一些攻击代码,被用来做网络钓鱼攻击。
解决方案
Chrome并没有禁止直接使用data:url的方式加载数据,如iframe,所以可以把数据放到iframe的属性src里。
var win = window.open();
var pdf = "data:application/pdf;base64," + data;
win.document.write('<iframe src="' + pdf + '" frameborder="0" style="border:0; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%;" allowfullscreen></iframe>')