javascript - 由于 CSP 错误,无法在 firefox 中下载 blob
问题描述
我正在尝试从 blob 下载 PDF 文件。整件事都在iframe
里面,当我尝试下载它时,它会在控制台中抛出这个错误:Content Security Policy: The page’s settings blocked the loading of a resource at blob:http://localhost:8080/myApp/31d389m6-8njb-n7gv-427n-bm86ynte36hc("child-src")
,我试过这个:
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = fileName || 'download';
document.body.appendChild(a);
const clickHandler = function() {
setTimeout(function(){
URL.revokeObjectURL(url);
this.removeEventListener('click', clickHandler);
a.parentNode.removeChild(a);
}, 150);
};
a.addEventListener('click', clickHandler, false);
a.click();
我已添加<meta http-equiv="X-UA-Compatible" content="IE=edge">
到主页和 iframe 中,但仍然存在此错误。它适用于其他浏览器,如 chrome 和 edge。有什么我想念的吗?
解决方案
在 CSP 中添加“blob:”作为“frame-src”,根据语句“某些浏览器专门从源指令中排除 blob 和文件系统。 ”(参考https://developer.mozilla.org/en-US/docs/Web /HTTP/Headers/Content-Security-Policy/frame-src )
我觉得firefox是那些浏览器之一。就我而言,这解决了这个问题。
推荐阅读
- java - pdfBox:如何从签名字段中获取签名名称
- reactjs - 在函数组件内渲染有状态的类组件实例
- c++ - Gstreamer:每 5 秒使用 multifilesink 保存图像/jpeg
- reactjs - Redux/Saga/React 使用 mapDispatchToProps 使用 dispatch props 初始化组件
- javascript - 用 JAVASCRIPT 编写一个测验,返回电影以在 Netflix 上观看
- sql - 当某些记录可以进行有效转换而其他记录不能进行有效转换时,在 SQL 中工作的 DateValue 等效项?
- python - Python 中的累积持续时间构建
- c - 在 K&R C 中传递字符串文字
- google-app-engine - Google Cloud Endpoints 和 Guice 出现错误“调用者没有权限”
- requirejs - RequireJS 转译插件应该如何返回结果?