内容脚本从扩展程序加载图像 (CSP)

Question

我正在为 chrome 和 firefox 开发一个浏览器扩展。

我的内容脚本注入（仅在 Twitter 中）一些从另一台服务器托管的新图像。

这是我在做什么的基本示例：

fetch('mysite.com')
    .then(data => {
         let imgTag = document.createElement('img');
         imgTag.src = data.url; // (https://example.com/image.jpg)
         div.appendChild(imgTag);
    });

它适用于 chrome 但不适用于 firefox，控制台显示与内容安全策略相关的错误，它只是说在 Twitter 上应用的 CSP 规则不允许我托管的图像加载。

让我感到困扰的是为什么它在 chrome 上工作正常？

Answer 1

将图像与您的扩展捆绑在一起。扩展网址 (moz-extension://) 不受 CSP 约束。

如果您需要动态内容，则必须等到 1294996 or 1267027 问题得到实施。