Eelectron访问Webview标签里的网页全局
从Electron版本12.0.1开始,BrowserWindow
默认的webPreferences
配置里contextIsolation
的默认值从false
改成true
了。先看看这个参数的描述:
是否在独立 JavaScript 环境中运行 Electron API和指定的
preload
脚本. 默认为true
。preload
脚本所运行的上下文环境只能访问其自身专用的document
和global
window
,其自身一系列内置的JavaScript (Array, Object, JSON等等) 也是如此,这些对于已加载的内容都是不可见的。 Electron API 将只在preload
脚本中可用,在已加载页面中不可用。 这个选项应被用于加载可能不被信任的远程内容时来确保加载的内容无法篡改preload
脚本和任何正在使用的Electron API。 该选项使用的是与Chrome内容脚本相同的技术。 你可以在开发者工具Console选项卡内顶部组合框中选择 'Electron Isolated Context'条目来访问这个上下文。
把文档里面翻译成中文的内容适当改回来之后,应该容易理解吧?就是 contextIsolation = true
时你预加载的 preload
脚本和窗口加载的第三方网站内容是两个隔离的 window
对象, preload
脚本没办法访问第三方网站页面里的全局window
对象!
当然这个修改对 <webview>
标签也是生效的,但因为Eelecton本身不鼓励使用 <webview>
标签的关系,文档里面没有明显的提示。如果你也遇到升级Electron版本后 <webview>
标签用的 preload
读取不到第三方页面的全局 window
对象的问题。可以在 <webview>
标签增加上webpreferences
这个属性:
<webview id="viewFrame" ref="webview" :src="pageUrl" :preload="preload" :useragent="userAgent" :partition="partition"></webview>
<!-- 改成 -->
<webview id="viewFrame" ref="webview" :src="pageUrl" :preload="preload" :useragent="userAgent" :partition="partition" webpreferences="allowRunningInsecureContent, contextIsolation=0" disablewebsecurity></webview>
这样旧版的preload
脚本就能正常的在 <webview>
里面执行了!