无星的electron之旅（六）——electron 应用协议唤起

1、背景

应用但愿能经过其余应用唤起，这应该是个很是常见的需求html

2、如何唤起

搜半天，全是基于协议的。protocolvue

接着会发现关键代码node

app.setAsDefaultProtocolClient(PROTOCOL, process.execPath, args);
复制代码

可是这有一个关键点：你至少运行过一次程序，才能注册这个协议！！！

这就让人很难受了。segmentfault

那么咱们须要想一想，有没有办法在安装的时候把协议写进去？windows

答案是：有。api

如何在安装的时候把协议写进去？

既然要在安装的时候写进去，那么一定须要在打包的地方下功夫。浏览器

这里我使用的是electron-builder来进行打包（个人项目是基于vue-cli4配合vue-cli-plugin-electron-builder建立的）markdown

所以咱们的打包配置文件中，须要写入protocols配置app

注意，mac和Windows协议是分开的。

这里咱们解释一下

1.mac上直接在这写就行。（亲测可行）

mac的协议唤起，实质上是dmg安装文件后的info.plist文件下的URLType，干过iOS开发的同事应该都有经验。

路径是/Application/你的应用程序右键显示包内容 /Contents/Info.plist

2.Windows须要额外写脚本（写本博客的时候，我还没测试过Windows）(亲测可行)

Windows须要经过指定打包方式nsis，并在打包时注入执行的sh脚本，以达到安装注入协议的目的。

这里有另外一个注意的点，就是卸载的时候最好能卸载掉对应的协议。（用户体验至上）

而后打包便可

到目前为止，你的应用应该就能够被唤起了

setAsDefaultProtocolClient是不须要写的

3、怎么唤起应用测试？

还记得以前你写的协议名称么？好比我这里叫szyxqca

打开浏览器，在地址栏输入

szyxqca://
复制代码

便可

理论上你的浏览器会唤起你的应用

若是要传参呢？

szyxqca://startapp/here?xxx=123&xxx2=222
复制代码

这里的startapp/here其实都是没用的，主要是配合添加host和path以及query，这种格式比较适合后期延展

4、如何经过这种方式传参，怎么接收呢？

须要两个生命周期

// windows唤起
app.on('second-instance', (event, argv) => {
  if (process.platform === 'win32') {
    logger.warn('唤起');
    logger.warn(event, argv);
    //TODO:还没写
  }
});

// macOS唤起
app.on('open-url', (event, urlStr) => {
  logger.warn('唤起');
  logger.warn(event, urlStr);
  // 解析数据
  const urlObj = new URL(urlStr);
  const { searchParams } = urlObj;
  //数据
  const xxx = searchParams.get('xxx');
  const xxx2 = searchParams.get('xxx2');
});

复制代码