我尝试使用modal.loadfile(
${__dirname}/pages/Company/login.html?id=1234
) 但是出现错误 电子:无法加载URL:file:///users/excelgraphics/documents/regular%20jobs/oot/aux%20service/aux%20services/pages/newservice.html%3fid=1234带有错误:
const popupLogin = (htmlFile, parentWindow, width, height) => {
let modal = new BrowserWindow({
width: 600,
height: 500,
modal: true,
resizable: false,
icon: path.join(__dirname + '/public/auxwall/logos/favicon.png'),
parent: MainWindow,
frame: false,
webPreferences: {
preload: path.join(__dirname, 'preload.js'),
contextIsolation: false,
nodeIntegration: true,
}
})
modal.loadFile(`${__dirname}/pages/Company/login.html`)
return modal;
}
我尝试这样做如何将一个从Mainwindow发送到Electron JS中的Childwindow的变量?但模态窗口无法从主进程访问消息
记住您的模态只是一个没有框架的窗口,可以通过使用
Inter-process Communication来回传递数据。要开始确保您的电子应用程序,您应该真正阅读
Context隔离id
传递到新创建的窗口,请使用{window}.webcontents.send
加载页面后立即立即将login.html
发送到窗口。
id
const popupLogin = (htmlFile, parentWindow, width, height) => {
// Get the customers id from whatever source necessary.
let id = 99;
// Create the window.
let modal = new BrowserWindow({
width: 600,
height: 500,
modal: true,
resizable: false,
icon: path.join(__dirname +
'/public/auxwall/logos/favicon.png'),
parent: MainWindow,
frame: false,
show: false, // Hide possible flash and DOM update(s).
webPreferences: {
preload: path.join(__dirname, 'preload.js'),
contextIsolation: true, // Set to true
nodeIntegration: true, // Node integration (removed in Electron v12)
}
})
// Load the window.
// Note: The loadFile() method returns a promise.
modal.loadFile(`${__dirname}/pages/Company/login.html`)
.then(() => { modal.webContents.send('login:id', id); })
.then(() => { modal.show(); }) // Now show the modal
return modal;
}
(主线程)
preload.js
const contextBridge = require('electron').contextBridge;
const ipcRenderer = require('electron').ipcRenderer;
// White-listed channels.
const ipc = {
'render': {
// From render to main.
'send': [],
// From main to render.
'receive': [
'login:id'
],
// From render to main and back again.
'sendReceive': []
}
};
contextBridge.exposeInMainWorld(
// Allowed 'ipcRenderer' methods.
'ipcRender', {
send: (channel, args) => {
let validChannels = ipc.render.send;
if (validChannels.includes(channel)) {
ipcRenderer.send(channel, args);
}
},
receive: (channel, listener) => {
let validChannels = ipc.render.receive;
if (validChannels.includes(channel)) {
// Deliberately strip event as it includes `sender`
ipcRenderer.on(channel, (event, ...args) => listener(...args));
}
},
invoke: (channel, args) => {
let validChannels = ipc.render.sendReceive;
if (validChannels.includes(channel)) {
return ipcRenderer.invoke(channel, args);
}
}
}
);
(渲染线)
login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="module" src="login.js"></script>
</head>
<body>
....
</body>
</html>
(渲染线)
login.js