无法从 Firefox 上的扩展访问远程资源

Can't access a remote resource from an extension on firefox

提问人:Musius 提问时间:11/13/2023 更新时间:11/13/2023 访问量:27

问:

我一直在尝试从页面 B 上运行的扩展程序向我自己的服务器 A 发出请求,如果我在 Chrome 上运行扩展程序,一切都很顺利,但它在 Firefox 上失败了,并出现以下错误:

'Content-Security-Policy: The page’s settings blocked the loading of a resource at A (“connect-src”).'

该扩展向 B 页面添加一个按钮,并尝试使用此代码的 fetch 向服务器 A 发出 PUT 请求

function sendData(body) {
    fetch(`${API_URL}/request-help`, {
        method: "PUT",
        body: JSON.stringify(body),
        headers: {
            "Content-type": "application/json; charset=UTF-8"
        }
    })
        .catch(error => {
            console.error(error);
        })
}

我已添加到清单中"host_permissions": ["<all_urls>"],

尝试添加 CSP

  "content_security_policy": {
        "extension_pages": "script-src 'self' 'unsafe-eval'; connect-src *; style-src * 'unsafe-inline' 'self' "
  }
谷歌-Chrome-扩展 火狐插件

评论

0赞 wOxxOm 11/13/2023
在后台脚本中发出请求,如下所示
0赞 Musius 11/13/2023
根据链接,如果这是问题所在,似乎它不应该在 chrome 上运行。
0赞 wOxxOm 11/13/2023
仅当服务器对两个浏览器使用相同的 Access-Control 标头进行响应时。
0赞 Musius 11/13/2023
我不明白你的评论。服务器对两个浏览器返回相同的响应,我不明白为什么它们应该不同。
0赞 wOxxOm 11/13/2023
由于我没有看到标题以及您发出请求的确切位置,因此我只能猜测。如果它是一个内容脚本,并且它在 Chrome 中工作,则该 URL 必须是同源的,或者响应具有正确的访问控制标头。如果一切都是一样的(即没有重定向,页面的CSP和API的标题没有差异),并且在Firefox中不起作用,那么这是Firefox中的错误。

答:

0赞 Musius 11/13/2023 #1

我已经遵循@xOxxOm建议并将提取调用移动到后台服务,现在一切似乎都在工作。想避免这样做,但从代码架构的角度来看,我实际上很喜欢它。