public/electron-egg
1
0
Fork 0
mirror of https://gitee.com/dromara/electron-egg.git synced 2026-05-14 11:52:07 +08:00
Code Issues Packages Projects Releases Wiki Activity

重写双向通信demo

Browse Source
This commit is contained in:
gsx
2022-04-23 20:11:42 +08:00
parent bde9c2c1d4
commit fd45a3305c
3 changed files with 57 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
electron/controller/example.js
View File

@@ -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;

6
frontend/src/api/main.js
View File

@@ -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 = {

81
frontend/src/views/base/socket/Ipc.vue
View File

@@ -28,34 +28,6 @@
结果：{{ message3 }}
</a-space>
</div>
<div class="one-block-1">
<span>
1. 渲染进程与主进程IPC通信
</span>
</div>
<div class="one-block-2">
<a-list bordered>
<a-input-search v-model="content" @search="helloHandle">
<a-button slot="enterButton">
send
</a-button>
</a-input-search>
</a-list>
</div>
<div class="one-block-1">
<span>
2. 主进程API执行网页函数
</span>
</div>
<div class="one-block-2">
<a-list bordered>
<a-input-search v-model="content2" @search="executeJSHandle">
<a-button slot="enterButton">
send
</a-button>
</a-input-search>
</a-list>
</div>
<div class="one-block-1">
<span>
3. 长消息： 服务端持续向前端页面发消息
@@ -63,9 +35,9 @@
</div>
<div class="one-block-2">
<a-space>
<a-button @click="socketMsgStart">开始</a-button>
<a-button @click="socketMsgStop">结束</a-button>
结果：{{ socketMessageString }}
<a-button @click="sendMsgStart">开始</a-button>
<a-button @click="sendMsgStop">结束</a-button>
结果：{{ messageString }}
</a-space>
</div>
</div>
@@ -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;