电子快速启动、ipcMain、CSP 在 Javascript 中阻止“评估”答案

【问题标题】：electron-quick-start, ipcMain, CSP blocks 'eval' in Javascript电子快速启动、ipcMain、CSP 在 Javascript 中阻止“评估”
【发布时间】：2021-03-06 22:13:28
【问题描述】：

我克隆了electron-quick-start demo，并测试了ipcMain函数。按照文档在main.js中添加这个

const { ipcMain } = require('electron')
ipcMain.on('asynchronous-message', (event, arg) => {
  console.log(arg) // print "ping"
  event.reply('asynchronous-reply', 'pong')
})

ipcMain.on('synchronous-message', (event, arg) => {
  console.log(arg) // print "ping"
  event.returnValue = 'pong'
})

在 preload.js 中

const { ipcRenderer } = require('electron')
console.log(ipcRenderer.sendSync('synchronous-message', 'ping')) // print "pong"

ipcRenderer.on('asynchronous-reply', (event, arg) => {
  console.log(arg) // print "pong"
})
ipcRenderer.send('asynchronous-message', 'ping')

我不能添加renderer.js，因为它说

// This file is required by the index.html file and will
// be executed in the renderer process for that window.
// No Node.js APIs are available in this process because
// `nodeIntegration` is turned off. Use `preload.js` to
// selectively enable features needed in the rendering
// process.

它找不到require（在renderer.js中）

问题是开发工具无法在 preload.js 中获取值

ipcRenderer.on('asynchronous-reply', (event, arg) => {
  console.log(arg) // print "pong"
})
ipcRenderer.send('asynchronous-message', 'ping')

我的 node.js 终端可以得到 'ping' 字符串，这是开发工具的问题==> screenshot

【问题讨论】：

标签： electron ipc content-security-policy

【解决方案1】：

electron-quick-start demo的index.html文件包含CSP规则：

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

改成：

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

因为 eval 表达式在某处使用。是的，它“不安全”，但这只是演示。稍后您可以整理出使用了“eval”构造的内容并进行修复。

您还可以删除上述两个元标记，以避免在第一步出现内容安全策略问题。

【讨论】：