electron-quick-start、ipcMain、CSP 在 Javascript 中阻塞 'eval'

Question

克隆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(in renderer.js)

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

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

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

Answer 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”构造并修复它们。

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

electron-quick-start、ipcMain、CSP 在 Javascript 中阻塞 'eval'

electron-quick-start, ipcMain, CSP blocks 'eval' in Javascript

ipc

content-security-policy

electron