Electron [1]允许通过编写网页来构建桌面程序，使得开发桌面软件变得异常轻松，各类通过 Electron 开发的软件层出不穷。此文主要针对网页里的 QQ 临时会话按钮，使用 Electron 应该如何优雅地操作呢？
虽然我现在已经很少上 Q，但不得不说，QQ 临时会话是很方便的一个功能。它允许在网页里添加一条链接点击直接弹出 QQ 会话。
可直接在 QQ 推广[2]中登录并生成链接，格式如：
http://wpa.qq.com/msgrd?v=3&uin={{uin}}&site=qq&menu=yes
若是在网页中引入，可直接加上新窗口打开但属性，如：
<a href="http://wpa.qq.com/msgrd?v=3&uin=10000" target="_blank">QQ 交谈</a>
又或者可以直接使用 tencent 协议的链接来发起临时会话，链接如 tencent://message/?uin=10000，则 HTML 如下：
<a href="tencent://message/?uin=10000" target="_blank">QQ 交谈</a>
Electron 与 QQ 临时会话
在 Electron 中，如若直接采用网页中的方式，点击链接将会在新的窗口中打开，而且你无法控制它，这明显不是我们想要的。
Electron 有个 shell[3] 模块，可提供使用默认浏览器中打开链接的功能，如：
const { shell } = require('electron')
shell.openExternal('tencent://message/?uin=10000')
这个体验比起第一种要好一些，但明显也不是我们想要的。如果能静默打开链接，达到直接弹出 QQ 会话，这个体验就比较好。这就需要用到 Electron 的 window.open 函数[4]，熟面熟面，其实可以说就是浏览器中的 window.open [5]。
倘若按照默认方式弹出新的 BrowserWindow，那么与第一种方式效果无异，可以自动将窗口关掉，也即：
const chat = window.open('tencent://message/?uin=10000')
setTimeout(()=>{
chat.close()
},2000)
我们需要隐藏掉这个新创建的 BrowserWindow，按照 window.open 文档最底部的说法，定制弹出的新窗口。可直接将 show 选项设置为 false 达到隐藏效果，如下：
// main process
const win = new BrowserWindow()
win.webContents.on('new-window', (event, url, frameName, disposition, options, additionalFeatures) => {
if (frameName === 'chat') {
Object.assign(options, {
modal: true,
parent: win,
show: false
})
event.newGuest = new BrowserWindow(options)
}
})
五秒后关闭这个隐藏的窗口。
// renderer process
const chat = window.open('tencent://message/?uin=10000', 'chat')
setTimeout(()=>{
chat.close()
},5000)
参考资料
本文历史
- 2019 年 04 月 24 日 完成初稿