在Electron中最快速预加载脚本
2019-08-14 10:09:00来源:博客园 阅读 ()
背景
在Electron打开新窗口的时候,提前加载一段JavaScript脚本,以此内置一些属性或接口给被打开的页面。之所以要以注入方式,而不是页面自己引用,原因是不想麻烦页面自行引用,不想修改旧有的业务逻辑。
方法一
一开始是想在打开BrowserWindow后,执行executeJavaScript方法来给相应的窗口注入脚本。
不过这个方法虽然可以在相应的窗口注入脚本,但是它的执行的顺序太后,无法在页面加载时加载到,就导致了如果页面的在加载时使用了注入接口,就会有调用不到问题。
所以这个方法不可行。
PS:executeJavaScript方法,https://electronjs.org/docs/api/web-contents
方法二
后来我在new BrowserWindow([options])方法,也就是新建窗口的方法找到了一个preload参数。
const { BrowserWindow } = require('electron') const path = require('path') const renderProcessApi = path.join(__dirname, './inject.js') let win = new BrowserWindow({ webPreferences: { preload: renderProcessApi } })
这个脚本文件,会在页面加载资源前就加载执行,保证了页面无论是在什么地方、什么时候调用注入接口都能调用到。
特别注意
如果窗口是在主进程创建的,估计有人就会发现注入的脚本文件会在主进程和对应的渲染进程各执行了一遍(我也不清楚为什么会有这样的效果)。
这时有可能会导致打开窗口失败,因为注入脚本中使用的对象或方法是主进程没有的,例如window对象。
解决办法是得判断脚本是在渲染进程时,才执行脚本内容。
if (require('electron').remote) { window.hello = function(){ console.log(‘world') } }
可以通过require('electron').remote,来判断是否在渲染进程。
原文链接:https://www.cnblogs.com/lovesong/p/11161293.html
如有疑问请与原作者联系
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
- Jquery 快速构建可拖曳的购物车DragDrop 2019-09-30
- Electron npm install 常见错误(Linux) 2019-08-14
- Electron npm install 常见错误(Windows) 2019-08-14
- electron-vue多显示屏下将新窗口投放是其他屏幕 2019-08-14
- 构建Electron的常见问题(Mac) 2019-08-14
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash