在前面做了一些 Eelectron-vue 的基础调研,包含项目构建,打包应用以及构建安装程序等,其中也碰到了一些问题,基本上能解决的都解决了。

做了前面的研究准备,接下来就是项目的实际开发。目前是在 主进程 中可以启动 子进程(这里指另外一个exe程序) ,并且能获取到 子进程 返回的数据,所以接下来要调研的就是 怎么向子进程传递参数以及怎么获取子进程中返回的数据?

2.父子进程的参数传递

前面使用的是 spawn 的方式去实现的父子进程之间的通信,这里也还是使用 spawn 实现父子进程之间的参数传递。

其中子进程传给父进程就不需要做过多的研究了,父进程在启动子进程的时候,在 stdout 中就能获取到子进程的返回值,在返回值中就能搞定参数的问题。

这里主要是实现父进程怎么传递参数给子进程。

我们的实现逻辑是

用户点击登录,渲染进程会往主进程中发送参数。
主进程获取到参数,将参数传递给子进程。
子进程获取参数进行校验,检查登录信息是否正确,并返回结果。
主进程获取到返回值将返回值传递给渲染进程,然后显示在页面,提示用户。

首先在渲染进程中需要使用 imRenderer 去发送事件给主进程
login.vue 定义如下:

onSubmit() {
      this.$refs.loginForm.validate((valid) => {
        console.log("loginVo:", this.loginVo);
        this.loginVo.username += "@dynarose.com";
        if (valid) {
          this.$electron.ipcRenderer.send("login", this.loginVo);
          this.$electron.ipcRenderer.on('login-message',(event, arg)=>{
            console.log('登陆结果:',arg)
          // this.$router.push("/home");
        } else {
          console.log("error submit!!");
          return false;
      });

主要的代码是下面,将用户输入的数据对象发送给主进程

this.$electron.ipcRenderer.send("login", this.loginVo);

在主进程main.js中定义如下

// 监听登陆渲染进程事件
ipcMain.on("login", (event, arg) => {
  let message = ''
  let cmdStr = '' + JSON.stringify(arg) + ''
  let ch_login = cp.spawn(`${__dirname}/main8.exe`)
  ch_login.stdin.write(cmdStr + '\n')
  ch_login.stdout.on('data', (data) => {
    let logs = data.toString().split('\n').filter(x => x);
    logs.forEach(el => {
      message = `${el}\n\n`
    });
    log.info('login response data:', message)
    event.sender.send('login-message', JSON.parse(message))
  ch_login.stderr.on('data', (data) => {
    log.info('login response data:', data)

其中cp定义

const cp = require('child_process')

通过cp.spawn先建立通道,然后使用stdin.write方法将参数信息写给子进程即参数传递。在stdout中去获取到子进程返回的数据,并且将数据转为字符串。

可以查看日志的输出,可以查看我们已经获得子进程返回的结果。

[2020-10-09 18:07:24.197] [info] login response data: {"msg":"账户密码不匹配","type":"result"}

将结果返回给渲染进程代码见上面main.js的定义,主要代码为

event.sender.send('login-message', JSON.parse(message))

然后在login.vue中可以监听到结果,主要代码为

this.$electron.ipcRenderer.on('login-message',(event, arg)=>{
   console.log('登陆结果:',arg)

在这里插入图片描述
那么现在为止,我们就实现了,从渲染进程到主进程,主进程到子进程,子进程到主进程,主进程到渲染进程之间的数据传递。

1.前言在前面做了一些Eelectron-vue的基础调研,包含项目构建,打包应用以及构建安装程序等,其中也碰到了一些问题,基本上能解决的都解决了。做了前面的研究准备,接下来就是项目的实际开发。目前是在主进程中可以启动子进程(这里指另外一个exe程序),并且能获取到子进程返回的数据,所以接下来要调研的就是怎么向子进程传递参数以及怎么获取子进程中返回的数据?2.父子进程的参数传递前面使用的是spawn的方式去实现的父子进程之间的通信,这里也还是使用spawn实现父子进程之间的参数传递。其中子进程传给
使用electron vue开发pc软件调用外部exe的部分记录 1、把外部exe放到project目录下,该project目录,以及含子目录的vue文件只要通过引用当前相对目录就可以索引到外部exe文件。 外部exe的文件放置位置: vue源文件调用外部exe的部分代码 2、npm build后生成win32-ia32-unpacked文件夹,该文件夹默认不会打包进来外部exe,因此需要把外部exe也拷贝到该目录下,这样electron build生成的exe就不会找不到外部exe调用.
在之前的文章中,实现了Electron-vue在不同系统打包成安装程序。但这只是前端build/package之后的文件打包,虽然服务端的编译之后的exe文件也可以放到一起打包,并且可以去启动服务端程序。然而不能与服务端通信的话,那么这个程序存在的意义就不大。所以在这片文章中会讲一下怎么在安装之后,启动应用程序调用服务端程序,同时获取服务端的输出值/返回值。 由于不是传统意义上的前后端通信(常见的前后端通信,只需要使用http/https进行通信即可,request发送请求,response返回请 function executor() { var exec = require('child_process').exec, child; // exec_path 写入需要执行的命令 var exec_path = "a.exe"; // 执行函数 child = exec(exec_path, function (error, stdout, stderr) { if(error) return con var args = process.argv; console.log(args);//[ 'C:\\Program Files\\nodejs\\node.exe','E:\\jenkins\\workspace\\app.js','hello' ] 获取我们需要的参数: var arg = process.... 使用Electron来解决跨平台桌面应用(由于之前学过vue,没有实战过,所以打算electronvue一起练手,所以选用了Electron-Vue)。 打包之后的程序,需要提供给用户一键式安装,所以需要将所有的前端代码以及后台提供的exe文件一起打包为可安装的文件。 用户安装之后,打开桌面应用的同时,启动后台服务,以便用户操作
vue调用本地exe程序, 原生js同理1.搭建服务2.路由文件3.前端发起请求 此方法需要后端的配合,简单来说了下实现思路,我是使用node+express搭建了一个服务,通过引用node中的 child_process 模块来实现的这个需求 1.搭建服务 在项目根目录下创建 bin/index.js const express = require('express'); //npm下载并引入express模块 npm -express -D const router = require('../rout
github_26990911: 因为你的message是在js加载时就决定了,所以你只要包装成function即可,比如官方的例子:https://github.com/alibaba/react-intl-universal/blob/master/packages/react-intl-universal/examples/browser-example/core/util.ts#L4 这个是demo效果:https://fe-tool.com/react-intl-universal 【Eelectron-vue】构建桌面应用(20)-electron的退出quit和exit 曾经的你d: https://blog.csdn.net/m0_52539553/article/details/127069490?spm=1001.2014.3001.5502 【Eelectron-vue】构建桌面应用(20)-electron的退出quit和exit 网络犯罪咸鱼人: 请问有结果了嘛,我也有这方面的需求