打开子窗口时出现错误消息“未捕获的ReferenceError:未定义”。我正在使用一条异步消息发送到主进程，以在从主渲染器脚本按下按钮时为主应用程序窗口创建子窗口。我可以访问主渲染器脚本中的 Node 。我希望在脚本中为子窗口提供一些 Node 库，但是遇到了nodeIntegration问题。我在主渲染以及子渲染上将其设置为true。我可以在脚本中访问主要html渲染的 Node 功能，但不能访问子 Node 。我想我可能对 Electron 应用程序的结构不正确。以下是相关代码:
index.js(发送消息的主要渲染器脚本，在按下按钮时调用)
function addImage(){
ipcRenderer.send('add-image-req', 'testID');
}
function createWindow () {
const win = new BrowserWindow({
width: 1200,
height: 900,
frame: false,
webPreferences: {
nodeIntegration: true,
nodeIntegrationInSubFrames: true,
nodeIntegrationInWorker: true,
contextIsolation: false,
enableRemoteModule: true
//preload: path.join(__dirname, 'preload.js')
}
})
win.loadFile('./assets/html/index.html')
win.webContents.openDevTools()
/*
var menu = Menu.buildFromTemplate([
{
label : 'File',
submenu : [
{
label : "Exit",
click() {
app.quit()
}
}
]
}
])
Menu.setApplicationMenu(menu)
*/
Menu.setApplicationMenu(null)
ipcMain.on("add-image-req", (event, arg) => {
console.log(arg);
const child = new BrowserWindow({
parent: win,
nodeIntegration: true,
contextIsolation: false
})
child.loadFile("./assets/html/image.html")
child.webContents.openDevTools()
})
}
const path = require("path");
编辑，再现性极低
为项目创建一个新文件夹，然后在终端中执行
npm init -y
npm install electron
进入创建的package.json并将“main”键更改为“main.js”。将“脚本”键更改为“开始”:“Electron ”。
以下是每个脚本应包含的内容。我将在其中复制最少的代码。
main.js:
const { app, BrowserWindow, Menu, ipcMain } = require('electron')
const path = require('path')
function createWindow () {
const win = new BrowserWindow({
width: 1200,
height: 900,
frame: false,
webPreferences: {
nodeIntegration: true,
nodeIntegrationInSubFrames: true,
nodeIntegrationInWorker: true,
contextIsolation: false,
enableRemoteModule: true
//preload: path.join(__dirname, 'preload.js')
}
})
win.loadFile('./index.html')
win.webContents.openDevTools()
/*
var menu = Menu.buildFromTemplate([
{
label : 'File',
submenu : [
{
label : "Exit",
click() {
app.quit()
}
}
]
}
])
Menu.setApplicationMenu(menu)
*/
Menu.setApplicationMenu(null)
ipcMain.on("add-image-req", (event, arg) => {
console.log(arg);
const child = new BrowserWindow({
parent: win,
nodeIntegration: true,
contextIsolation: false
})
child.loadFile("./image.html")
child.webContents.openDevTools()
})
}
app.whenReady().then(() => {
createWindow()
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow()
}
})
})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>index</title>
</head>
<body>
<button>Click</button>
<script src="./index.js"></script>
</body>
</html>
const { ipcRenderer } = require('electron')
document.querySelector("button").addEventListener('click', () => {
ipcRenderer.send('add-image-req', 'testID')
})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<a href="">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Eligendi adipisci impedit voluptatibus numquam consectetur sapiente possimus earum nobis et, molestiae minus ipsam. Dolore doloremque quia et assumenda maiores? Numquam, nostrum.</a>
<script src="./image.js"></script>
</body>
</html>
const path = require("path");
最佳答案
nodeIntegration是webPreferences的子选项，需要这样设置:
const child = new BrowserWindow({
parent: win,
webPreferences: { // <- You need to add this option.
nodeIntegration: true,
contextIsolation: false
}
})
nodeIntegration和contextIsolation应该在webPreferences内部设置。
关于javascript - 子渲染器electronicjs中对 Node 的访问失败，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/66807683/