内容安全策略:无法在Chrome扩展中加载Google API

Question

我正在使用react创建chrome扩展并实现google注册

所以我添加了

<script src="https://apis.google.com/js/api.js"></script>

在index . html

现在，当我构建代码和部署，chrome显示错误说

Refused to load the script 'https://apis.google.com/js/api.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' https://cdn.jsdelivr.net". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

我正在使用manifest版本3文件。

所以我加了

"content_security_policy": {
"extension_pages": "script-src 'self' https://apis.google.com; object-src 'self'"
}

现在显示的是

content_security_policy.extension_pages': Insecure CSP value "https://apis.google.com" in directive 'script-src'.
Could not load manifest.

我该如何解决这个问题?

Answer 1

我管理CSP与我的nginx设置添加标题到我的响应，如-

我不知道你说的manifest version 3 file是什么意思

add_header Content-Security-Policy "default-src 'self'"自我";font-src;manifest-src"自我";对象src"没有";连接src 'self' https://www.google-analytics.com/https://.googleapis.com/;">

你能试着把这行添加到你的代码(你的要求)-

connect-src 'self' https://www.google-analytics.com/ https://*.googleapis.com/;