我的电子应用里有一个<webview>。我希望进行安全的“外国”交流,就像我通过postMessage与iframe进行交流一样。举个例子:
webview.executeJavaScript("window.parent.postMessage('all done!')");
我与此子网页视图通信的唯一选择是打开nodeIntegration以便可以使用sendToHost吗?仅仅为了这一个功能而打开所有的nodeIntegration似乎有点杀伤力。
发布于 2016-09-12 11:38:22
即使禁用了nodeIntegration,您也可以在webview preload脚本中访问电子API,包括IPC。预加载脚本可以将函数注入到全局命名空间中,然后可以在webview中加载的页面中访问这些函数。一个简单的例子:
webview-preload.js
const { ipcRenderer } = require('electron')
global.pingHost = () => {
ipcRenderer.sendToHost('ping')
}webview-index.html
<script>
pingHost()
</script>window-index.html
<script>
const webview = document.getElementById('mywebview')
webview.addEventListener('ipc-message', event => {
// prints "ping"
console.log(event.channel)
})
</script>发布于 2020-05-04 04:56:05
最简单的方法
交流是
注意:(main.js或app.js或background.js或process.js )不需要传递(直接将组件传递给组件),我成功地在electron:3.1.10中实现了print html webview。
Webview的窗口
example1.html
<webview id="paper" style="width:300px;height:800px" src="file:///static/mywebview.html" nodeintegration></webview>example1.js
var webview = document.getElementById("paper");
webview.send("ping",data); 从mycomponent或window获取数据的(我直接从组件发送)
mywebview.html
<!---what data you want show----!>mywebview.js
const {
ipcRenderer
} = require('electron')
//data from window
ipcRenderer.on('ping', (e, data) => { console.log(data) })到window的webview
Webview到窗口(直接传递到组件)
mywebview.js
ipcRenderer.sendToHost("readyCompanyInfo",data) 在我的窗口中,如我使用vue (mycomponent.vue或mypage)
example1.html
const ipcRenderer = require("electron").ipcRenderer;
webview.addEventListener("ipc-message",(event)=>{
const {args,channel}=event;
if(channel=="readyCompanyInfo")
{
console.log(channel,args)
//here you can see data what u passed from webview to window
console.log(args[0])
}
})https://stackoverflow.com/questions/39441448
复制相似问题