[英]React + Electron webview tag preload js not working
当我使用 webview 标签时,预加载 js 不起作用
我的代码如下:
// test.js
<div>
<webview id="foo" src="https://www.github.com/" preload="file://preload.js"/>
</div>
我的 preload.js 文件:
// preload.js
alert('preload success')
我也试过这个:
// test.js
<div>
<webview id="foo" src="https://www.github.com/" preload={`file://${__dirname}/preload.js`}/>
</div>
我什至截获了 main.js 中的文件协议
// main.js
app.on('ready', () => {
protocol.interceptFileProtocol('file', (request, callback) => {
console.log('success')
const url = request.url.substr(7);
callback({path: path.normalize(`${__dirname}/${url}`)});
}, (error) => {
if (error) console.error('Failed to intercept protocol');
});
})
;
但这些尝试都没有奏效。 控制台中没有“成功”,也没有“成功”警报。 但是如果我使用这样的绝对路径:
// test.js
<div>
<webview id="foo" src="https://www.github.com/" preload="file:///home/ppp/electron-dict/src/components/preload.js"/>
</div>
代码运行良好,我的应用程序提示“成功”。 为什么是这样?
我的项目路径:
├── public
│ ├── index.html
│ ├── main.js
├── src
│ ├── App.js
│ ├── components
│ │ ├── test.js
│ │ ├── preload.js
│ └── index.js
Electron 和 React 版本:
├─ electron@7.1.1
├─ react@16.11.0
指示预加载是 webview 标记的顶级属性,不在 webpreferences 内
<webview src="https://www.github.com/" preload="./test.js"></webview>
一个字符串,它指定将在访客页面中运行其他脚本之前加载的脚本。 脚本的 URL 的协议必须是file:
或asar:
,因为它会在后台的访客页面中由require
加载。
当访客页面没有节点集成时,此脚本仍然可以访问所有 Node API,但在此脚本执行完成后,由 Node 注入的全局对象将被删除。
注意:此选项将在指定给will-attach-webview
事件的webPreferences
中显示为preloadURL
(而不是preload
)。
您可以找到有关 webview 的Electron 预加载脚本不起作用的更多信息?
我已经能够预加载 js,但没有使用 preload 属性。 相反,我从主进程注入它:
app.on('web-contents-created', (_event, contents) => {
contents.on('will-attach-webview', (_wawevent, webPreferences, _params) => {
webPreferences.preloadURL = `file://${__dirname}/webview-preload.js`;
});
});
在渲染器中使用 React。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.