From fd45a3305cf6cf43e3d4b21c2dea18af98b65ef7 Mon Sep 17 00:00:00 2001 From: gsx <530353222@qq.com> Date: Sat, 23 Apr 2022 20:11:42 +0800 Subject: [PATCH] =?UTF-8?q?=E9=87=8D=E5=86=99=E5=8F=8C=E5=90=91=E9=80=9A?= =?UTF-8?q?=E4=BF=A1demo?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- electron/controller/example.js | 78 +++++++++++-------------- frontend/src/api/main.js | 6 +- frontend/src/views/base/socket/Ipc.vue | 81 +++++++------------------- 3 files changed, 57 insertions(+), 108 deletions(-) diff --git a/electron/controller/example.js b/electron/controller/example.js index ddb57c4..79428c3 100644 --- a/electron/controller/example.js +++ b/electron/controller/example.js @@ -80,17 +80,6 @@ class ExampleController extends Controller { return data; } - /** - * hello - */ - hello (args) { - let newMsg = args + " +1"; - let content = ''; - content = '收到：' + args + '，返回：' + newMsg; - - return content; - } - /** * 消息提示对话框 */ @@ -150,40 +139,6 @@ class ExampleController extends Controller { return true; } - /** - * 长消息 - 开始 - */ - socketMessageStart (args, event) { - // 每隔1秒，向前端页面发送消息 - // 用定时器模拟 - - // 前端ipc频道 channel - const channel = 'controller.example.socketMessageStart'; - myTimer = setInterval(function(e, c, msg) { - let timeNow = Date.now(); - let data = msg + ':' + timeNow; - e.reply(`${c}`, data) - }, 1000, event, channel, args) - - return '开始了' - } - - /** - * 长消息 - 停止 - */ - socketMessageStop () { - clearInterval(myTimer); - return '停止了' - } - - /** - * 执行js语句 - */ - executeJS (args) { - let jscode = `(()=>{alert('${args}');return 'fromJs:${args}';})()`; - return webContents.fromId(1).executeJavaScript(jscode); - } - /** * 加载视图内容 */ @@ -607,6 +562,39 @@ class ExampleController extends Controller { return data; } + /** + * 双向异步通信 + * @param args 前端传的参数 + * @param event - IpcMainEvent 文档：https://www.electronjs.org/docs/latest/api/structures/ipc-main-event + */ + ipcSendMsg (args, event) { + // 前端ipc频道 channel + const channel = 'controller.example.ipcSendMsg'; + + if (args.type == 'start') { + // 每隔1秒，向前端页面发送消息 + // 用定时器模拟 + myTimer = setInterval(function(e, c, msg) { + let timeNow = Date.now(); + let data = msg + ':' + timeNow; + e.reply(`${c}`, data) + }, 1000, event, channel, args.content) + + return '开始了' + } else if (args.type == 'end') { + clearInterval(myTimer); + return '停止了' + } else { + return 'ohther' + } + } + + /** + * 测试接口 + */ + hello (args) { + console.log('hello ', args); + } } module.exports = ExampleController; diff --git a/frontend/src/api/main.js b/frontend/src/api/main.js index 3a034aa..bf7ab2d 100644 --- a/frontend/src/api/main.js +++ b/frontend/src/api/main.js @@ -7,10 +7,6 @@ const ipcApiRoute = { messageShowConfirm: 'controller.example.messageShowConfirm', selectFolder: 'controller.example.selectFolder', openDirectory: 'controller.example.openDirectory', - socketMessageStart: 'controller.example.socketMessageStart', - socketMessageStop: 'controller.example.socketMessageStop', - hello: 'controller.example.hello', - executeJS: 'controller.example.executeJS', loadViewContent: 'controller.example.loadViewContent', removeViewContent: 'controller.example.removeViewContent', createWindow: 'controller.example.createWindow', @@ -30,6 +26,8 @@ const ipcApiRoute = { doSocketRequest: 'controller.example.doSocketRequest', ipcInvokeMsg: 'controller.example.ipcInvokeMsg', ipcSendSyncMsg: 'controller.example.ipcSendSyncMsg', + ipcSendMsg: 'controller.example.ipcSendMsg', + hello: 'controller.example.hello', } const specialIpcRoute = { diff --git a/frontend/src/views/base/socket/Ipc.vue b/frontend/src/views/base/socket/Ipc.vue index fc83f30..55c08ea 100644 --- a/frontend/src/views/base/socket/Ipc.vue +++ b/frontend/src/views/base/socket/Ipc.vue @@ -28,34 +28,6 @@ 结果：{{ message3 }} -
- - 1. 渲染进程与主进程IPC通信 - -
-
- - - - send - - - -
-
- - 2. 主进程API执行网页函数 - -
-
- - - - send - - - -
3. 长消息： 服务端持续向前端页面发消息 @@ -63,9 +35,9 @@
- 开始 - 结束 - 结果：{{ socketMessageString }} + 开始 + 结束 + 结果：{{ messageString }}
@@ -75,10 +47,7 @@ import { ipcApiRoute } from '@/api/main' export default { data() { return { - content: 'hello', - content2: 'hello world', - reply: '', - socketMessageString: '', + messageString: '', message1: '', message2: '', message3: '' @@ -91,34 +60,28 @@ export default { init () { const self = this; // 避免重复监听，或者将 on 功能写到一个统一的地方，只加载一次 - this.$ipc.removeAllListeners(ipcApiRoute.socketMessageStart); - this.$ipc.removeAllListeners(ipcApiRoute.socketMessageStop); + this.$ipc.removeAllListeners(ipcApiRoute.ipcSendMsg); + this.$ipc.on(ipcApiRoute.ipcSendMsg, (event, result) => { + console.log('[ipcRenderer] [socketMsgStart] result:', result); - this.$ipc.on(ipcApiRoute.socketMessageStart, (event, result) => { - console.log('[ipcRenderer] [socketMsgStart] result:', result) - self.socketMessageString = result; - }) - this.$ipc.on(ipcApiRoute.socketMessageStop, (event, result) => { - console.log('[ipcRenderer] [socketMsgStop] result:', result) - self.socketMessageString = result; + self.messageString = result; + // 调用后端的另一个接口 + event.sender.send(ipcApiRoute.hello, 'electron-egg'); }) }, - helloHandle(value) { - const self = this; - this.$ipcCall(ipcApiRoute.hello, value).then(r => { - self.$message.info(r); - }) + sendMsgStart() { + const params = { + type: 'start', + content: '开始' + } + this.$ipc.send(ipcApiRoute.ipcSendMsg, params) }, - executeJSHandle(value) { - this.$ipcCall(ipcApiRoute.executeJS, value).then(r => { - console.log(r); - }) - }, - socketMsgStart() { - this.$ipc.send(ipcApiRoute.socketMessageStart, '时间') - }, - socketMsgStop() { - this.$ipc.send(ipcApiRoute.socketMessageStop, '') + sendMsgStop() { + const params = { + type: 'end', + content: '' + } + this.$ipc.send(ipcApiRoute.ipcSendMsg, params) }, handleInvoke () { const self = this;