• 技术文章 >web前端 >前端问答

    electron制作QQ音乐客户端-主进程与渲染进程通讯

    灭绝师太灭绝师太2021-08-30 17:43:05原创125
    Electron主进程 管理 所有网页及其对应的渲染进程,而渲染进程只能管理相应的网页, 一个渲染进程的崩溃不会影响其他渲染进程;那么两个进程之间如何通讯呢?

    11.png

    Electron 有两种进程:主进程和渲染进程。

    主进程

    1. 主进程通过创建 BrowserWindow 实例来创建 网页。 每一个 BrowserWindow 实例在其渲染过程中运行网页, 当一个 BrowserWindow 实例被销毁时,对应的渲染过程也会被终止。

    2.主进程 管理 所有网页及其对应的渲染进程。

    渲染进程

    1. 渲染进程只能管理相应的网页, 一个渲染进程的崩溃不会影响其他渲染进程。

    2. 渲染进程通过 IPC 与主进程通信在网在页上执行 GUI 操作。 出于安全和可能的资源泄漏考虑,直接从渲染器进程中调用与本地 GUI 有关的 API 受到限制。


    进程之间的通信可以通过 Inter-Process Communication(IPC) 模块进行:ipcMain 和 ipcRenderer

    若要创建一个窗口,请调用 BrowserWindow 类,但只能在主进程中使用(main.js):

        const { BrowserWindow } = require('electron')
        const win = new BrowserWindow()

    若要从渲染进程调用主进程,请使用 IPC 模块: 例如净化窗口模式下自定义关闭窗口功能

    1. 首先由主进程向渲染进程发送消息,告诉它窗口的id(开启了多个渲染进程);

      win.once('ready-to-show', () => {
        win.webContents.send('init_win_id', win.id);
        win.show()
      });

    2. 在渲染进程接收winid,并在关闭窗口时发送给主进程

        //渲染进程监听init_win_id事件(自定义),将winid赋给全局变量winid
        let winid = '';
        require('electron').ipcRenderer.on('init_win_id', (event, message) => {
    		winid = message;
        })
        // 关闭窗体
    	function closex(){		 
    		 //渲染进程里把窗口id发给主进程
    
    		const { ipcRenderer } = require('electron')
    		ipcRenderer.send('close_window', winid);
    	 
    	}

    3. 在主进程中接收需要关闭的渲染进程

        // 主进程获取winid关闭窗体
        ipcMain.on('close_window', (event, arg) => {    
            //app.quit()单个窗口可以直接app.quit()
            //win.close();
            // 1、接收渲染进程发来的窗口id
                let winid = arg;    
                console.log(winid);    
            // 2、通过id找到对应的BrowserWindow对象(win、win22),调用这个对象的close()关闭对应的窗口
                BrowserWindow.fromId(winid).close();
       
            })

    以上就是electron制作QQ音乐客户端-主进程与渲染进程通讯的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    上一篇:如何用前端三剑客创建漂亮的倒计时效果 下一篇:如何用HTML和CSS制作玻璃/模糊效果?
    线上培训班

    相关文章推荐

    • npm安装Electron缓慢网络超时导致失败• 在Webpack中如何构建Electron应用

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网