我正在创建一个 Electron 应用程序,并且根据 Electron 安全教程我添加了一个 CSP 元标记。运行应用程序时,devtools 中出现此问题。
我自己的代码中不存在您网站的内容安全策略阻止在 JavaScript 中使用“eval”
内容安全策略 (CSP) 防止将任意字符串评估为 JavaScript,从而使攻击者更难在您的网站上注入未经授权的代码。
要解决此问题,请避免使用、eval()
、new Function()
和setTimeout([string], ...)
来评估字符串。setInterval([string], ...)
eval
调用或其他字符串求值情况。该问题没有给出任何关于导致该问题的代码的线索,并且我尝试使用
'report-sample'
值对输出没有影响。在 Chrome 中打开 HTML 文件时不会出现该问题。我可以使用一个非常基本的应用程序重新创建警告。
main.js
const path = require("path");
const { app, BrowserWindow } = require("electron");
const createWindow = () => {
let mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
contextIsolation: true,
nodeIntegration: false,
}
});
mainWindow.loadURL(`file://${path.join(__dirname, "/index.html")}`);
};
app.on("ready", createWindow);
index.html<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
<title>Document</title>
</head>
<body>
<h1>CSP Issue Test</h1>
</body>
</html>
我想了解为什么会出现此问题并解决它,而不是仅仅抑制警告。
issues,“此日志消息目前正在开发中,如果您运行打包的应用程序,则不会发生。”这是一位 Electron 贡献者的说法。
此问题现已关闭,但仍然活跃,一些用户表示这有点令人困惑(我同意)。基于此,我认为我们在开发过程中就忽略了它。根据贡献者的说法,当应用程序打包时,它应该消失,尽管我自己还没有对此进行测试。
path
上的
join
方法),因此必须对其进行评估,因此它受到与实际 eval()
或
new Function(...)
相同的限制。如果您想避免这种情况,请改用串联。
也就是说,
mainWindow.loadURL(`file://${path.join(__dirname, "/index.html")}`);
需要变成
mainWindow.loadURL("file://" + path.join(__dirname, "/index.html"))
,问题就会自行解决。此 scriptlet 可用于在
eval()
被 CSP 阻止的网站上重现此问题:
try
{
let l_test = `${[ "1", "2", "3", "4" ].join(", ")}`;
}
catch(p_err)
{
console.error('CSP hiccup!');
}
因此,如果 eval()
与 CSP 发生冲突,则会捕获错误并将错误消息记录到控制台。
app.on('ready', () => {
mainWindow = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
}
});
});
并从 html 中删除它
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">