【问题标题】：I added a Content-Security-Policy but still the security warning appears我添加了 Content-Security-Policy 但仍然出现安全警告
【发布时间】：2021-02-05 05:58:22
【问题描述】：

我按照此处的建议添加了内容安全策略：https://www.electronjs.org/docs/tutorial/security#6-define-a-content-security-policy 和此处：https://content-security-policy.com/examples/electron/

<html lang="en">
<head>
  <meta http-equiv="Content-Security-Policy" content="default-src 'self'">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>New Electron App</title>
</head>
<body>
  <span>Our new Electron app</span>
  <div id="root"></div>
</body>
</html>

但我仍然收到此消息： “电子安全警告（不安全的内容-安全-策略）。此渲染器进程没有设置内容安全策略或启用了“unsafe-eval”的策略。这会使该应用程序的用户面临不必要的安全风险。应用打包后将不会显示此警告。”

如何解决这个安全警告？

【问题讨论】：

标签： electron content-security-policy

【解决方案1】：

这是预期的行为，因为它表示它将在未设置或设置允许不安全评估的策略时触发。他们只是希望您确保在没有 100% 确定的情况下不要添加任何评估。

For why this is only displayed when building 只有在您构建应用程序并且您的二进制文件仍称为“电子”时才会出现这种情况。

【讨论】：

是的，这只是提醒我们注意 CSP 的现有政策，而不是继续进一步发展的停止标志。我认为这对 100% 离线应用最不适用

【解决方案2】：

您可以简单地将这个环境变量添加到您的package.json。

{
  "scripts": {
    "electron": "ELECTRON_DISABLE_SECURITY_WARNINGS=true electron ."
  }
}

【讨论】：

我将它添加到 package.json 但仍然收到此警告消息
你在运行npm run electron吗？
将其添加到 package.json 时，我仍然会收到错误消息。我正在使用 Quasar 框架和 Electron。

【解决方案3】：

将script-src 'self' 添加到 CSP：

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self';">

它应该可以解决问题。这是 Electron 安全解析器的一个特性 - 它不知道 abt fallback 所以认为 script-src 不存在，本质是 here

【讨论】：

我添加了这个但仍然得到错误。我正在使用 Quasar 框架和 Electron
如果您的应用程序使用Content-Security-Policy: default-src 'self'; HTTP 标头，并且您添加<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self';"> 尝试修复错误，则可能。 HTTP 标头仍然不安全，Electron 安全系统会检查标头和元标记。
我可以使用来自@hans-koch 的以下答案来隐藏消息。我在我的应用程序中添加了process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = 'true'，消息消失了。
是的，但在这种情况下，您将失去改进/修改应用程序后可能出现的其他安全警告。您不需要禁止安全警告，它们出现在 Dev mode only 中并且不会出现在生产中。

【解决方案4】：

至少两种禁用 CSP 的方法：无 package.json

通过 CLI 禁用

考虑在 CLI 中运行 Electron 的应用源文件 main.js，如下所示：ELECTRON_DISABLE_SECURITY_WARNINGS=true npx electron main.js

在此使用 npx 我确实认为您很聪明，并且事先在本地安装了 Electron。

通过进程禁用

在任何地方定义（最好是顶级）以下process.env['ELECTRON_DISABLE_SECURITY_WARNINGS']=true

info taken from

【讨论】：

谢谢。它似乎工作正常
很高兴它有帮助

【解决方案5】：

在寻找解决方案很多天后，我在 VScode 源代码中找到了一个应用程序准备就绪时的功能

w.protocol.registerHttpProtocol(I.Schemas.vscodeRemoteResource, (Pe, Le) => {
    Le({ url: Pe.url.replace(/^vscode-remote-resource:/, 'http:'), method: Pe.method })
})

所以你需要一个协议来替换http，并且你必须注册为特权例如

protocol.registerSchemesAsPrivileged([{ scheme: 'server', privileges: { bypassCSP: true } }])
/*----*/
app.whenReady().then(() => {
    protocol.registerHttpProtocol('server', (request, response: any) => {
        const redirect: any = {
            method: request.method,
            url: request.url.replace(/^remote:/, 'http:')
        }

        if (request.method === 'POST' || request.method === 'PUT') {
            redirect.uploadData = {
                contentType: 'application/json',
                data: request.uploadData ? request.uploadData[0].bytes.toString() : ''
            }
        }

        response(redirect)
    })
})

然后，当您发出请求 server://localhost:3000/api 时，您不会收到错误 CSP - Content-Security-Policy

【讨论】：