首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在电子中与<webview>进行通信

问在电子中与<webview>进行通信
EN

Stack Overflow用户
提问于 2016-09-12 06:57:04
回答 2查看 13.6K关注 0票数 13

我的电子应用里有一个<webview>。我希望进行安全的“外国”交流,就像我通过postMessage与iframe进行交流一样。举个例子:

webview.executeJavaScript("window.parent.postMessage('all done!')");

我与此子网页视图通信的唯一选择是打开nodeIntegration以便可以使用sendToHost吗?仅仅为了这一个功能而打开所有的nodeIntegration似乎有点杀伤力。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2016-09-12 11:38:22

即使禁用了nodeIntegration,您也可以在webview preload脚本中访问电子API,包括IPC。预加载脚本可以将函数注入到全局命名空间中,然后可以在webview中加载的页面中访问这些函数。一个简单的例子:

webview-preload.js

代码语言:javascript
复制
const { ipcRenderer } = require('electron')    

global.pingHost = () => {
  ipcRenderer.sendToHost('ping')
}

webview-index.html

代码语言:javascript
复制
<script>
  pingHost()
</script>

window-index.html

代码语言:javascript
复制
<script>
  const webview = document.getElementById('mywebview')
  webview.addEventListener('ipc-message', event => {
    // prints "ping"
    console.log(event.channel)
  })
</script>
票数 33
EN

Stack Overflow用户

发布于 2020-05-04 04:56:05

最简单的方法

交流是

注意:(main.js或app.js或background.js或process.js )不需要传递(直接将组件传递给组件),我成功地在electron:3.1.10中实现了print html webview。

Webview的窗口

example1.html

代码语言:javascript
复制
    <webview id="paper" style="width:300px;height:800px" src="file:///static/mywebview.html" nodeintegration></webview>

example1.js

代码语言:javascript
复制
 var webview = document.getElementById("paper");
  webview.send("ping",data); 

从mycomponent或window获取数据的(我直接从组件发送)

mywebview.html

代码语言:javascript
复制
<!---what data you want show----!>

mywebview.js

代码语言:javascript
复制
    const {
        ipcRenderer
    } = require('electron')                                                                            
  //data from window                                                                   
    ipcRenderer.on('ping', (e, data) => { console.log(data) })

到window的webview

Webview到窗口(直接传递到组件)

mywebview.js

代码语言:javascript
复制
 ipcRenderer.sendToHost("readyCompanyInfo",data) 

在我的窗口中,如我使用vue (mycomponent.vue或mypage)

example1.html

代码语言:javascript
复制
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])

}
})
票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39441448

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档