在 Firefox WebExtension 中播放远程音频文件时出现 CSP 错误

Question

我正在开发一个扩展，我需要从远程服务器播放音频，我有另一个服务器来获取其他信息。

我在 manifest.json 中添加了以下行：

  "content_security_policy": "default-src 'self' https://firstserver.com https://serverwithaudio.com;"

我也试过了

  "content_security_policy": "default-src 'self' https://firstserver.com; media-src  https://serverwithaudio.com;"

但其中 none 有效，但我仍然收到此错误：

Content Security Policy: The page’s settings blocked the loading of a resource at https://serverwithaudio.com/media/audio1.mp3 (“default-src”).

是否可以播放来自两个不同来源的远程音频，或者我在 manifest.json

中遗漏了某些内容

Answer 1

我解决了这个问题。

首先，如果您将 content_security_policy 放入您的 manifest.json，您将无法在 Mozilla 扩展目录中提交它。

其次，我将音频文件移动到与获取信息相同的服务器上。然后从后台脚本播放音频。

当我点击内容脚本上的按钮时，我会向后台脚本发送一条消息，其中包含音频 url:

 let audioUrl = "https://example.com/media/audio.mp3";
 chrome.runtime.sendMessage({audio: audioUrl});

在后台脚本中：

chrome.runtime.onMessage.addListener(function(req, sender, sendResponse){
    if (req.audio) {
        (new Audio(req.audio)).play();
    }
    return true;
});

请记住，您仍然需要在权限指令中提及您的主机。

  "permissions": [
      "*://example.com/"
  ]

在 Firefox WebExtension 中播放远程音频文件时出现 CSP 错误

CSP error while playing a remote audio file in Firefox WebExtension

firefox-addon

content-security-policy

firefox-addon-webextensions