使用Electron开发一款Apk安装器应用

作为经常与安卓打交道的开发人员,apk安装是一件很频繁的事，但无奈一直找不到一款简洁的pc应用，可以作为apk默认打开方式，打开后直接安装到选定的安卓设备。那就自己撸一款pc应用吧。

(文章末尾附带源码与最终效果)

需求设计：

1. 可作为apk类型文件默认打开方式；
2. 可枚举当前已连接电脑的可用安卓设备；
3. 有安装状态展示；
4. ...

可行性分析：

主要功能是需要传输apk到手机，并命令手机安装这个文件，从安卓开发的角度来看，adb就可以完成这些事，它提供了一系列的命令，来支持PC与手机的数据交互。

结合以上分析，就可以大致构思下产品原型啦。

技术调研：

针对PC应用开发小白，PC端应用开发当然使用时下流行的electron，它提供了友善的运行环境与较低的学习成本，能满足大部分PC应用开发需求。

开发调试：

1. electron应用的项目结构基于nodejs。此处使用了[email protected]，先是初始化项目：

npm init
npm install --save-dev [email protected]

这里初始化可以参考官网教程

2. 接下来就是编写业务逻辑了，详细代码可以参考底部源码链接，此处介绍下主要功能函数。

• 检查软件运行环境：

如果电脑没有adb环境变量配置是无法运行的

/**
 * 检查是否有adb环境
 */
async function chcekAdbEnv() {
    const { error, stdout, stderr } = await execPromisefy('adb version');
    if (error) {
        console.error('listDevices|error:', error);
        throw e;
    }
    if (stderr) {
        console.error('listDevices|stderr:', stderr);
        throw e;
    }
    return stdout;
}

• 枚举设备信息：

该函数输出当前的设备id数组

/**
 * 枚举当前已连接安卓设备
 */
async function listDevices() {
    console.log('start list devices')
    const { error, stdout, stderr } = await execPromisefy('adb devices');
    if (error) {
        console.error('listDevices|error:', error);
        throw e;
    }
    if (stderr) {
        console.error('listDevices|stderr:', stderr);
        throw e;
    }
    console.log('stdout:', stdout);
    let deviceArray = []
    stdout.split('\n').forEach(line => {
        if ((line = line.trim()) && line.indexOf('List of devices attached') < 0) {
            deviceArray.push(line.split('   ')[0])
        }
    })
    console.log('deviceArray', deviceArray)
    return deviceArray;
}

• 安装apk到指定设备

输入id，输出带超时功能的Promise

/**
 * 安装apk到指定设备
 * 超时时间默认50s
 * @param {*} deviceId 
 * @param {*} apkPath 
 */
function installApk(deviceId, apkPath) {
    const installPromise = new Promise(async (resolve, reject) => {
        try {
            const { error, stdout, stderr } = await execPromisefy(`adb -s ${deviceId} install ${apkPath}`);
            if (error) {
                console.error('listDevices|error:', error);
                reject(e);
            }
            if (stderr) {
                console.error('listDevices|stderr:', stderr);
                reject(stderr);
            }
            resolve(stdout)
        } catch (e) {
            console.error(e)
            reject(e);
        }
    })
    const timeoutPromise = new Promise((resolve, reject) => {
        setTimeout(() => { reject('timeout') }, 50000)
    })
    return Promise.race([installPromise, timeoutPromise]);
}

• 接下来就是ui绘制，对接业务。

此处实现简单ui即可

//省略...

3. 下一步就是输出pc端安装包

这里需要使用electron-builder构建pc端安装包。

开发到这一步，被一个问题困扰住了，如何使自己基于electron开发的pc应用设置为某些文件的默认打开方式？

身为“伪”PC应用开发者，对一些涉及原生的api操作几乎是一窍不通的，而这个问题如果解决不了，那么这款应用也是毫无意义的，都无法设置默认打开，谈何便利性。

经过一番调研，发现其他electron应用如utools，Vscode等，是可以设置默认应用的，说明这条路是通的。

最终，在stackoverflow上找到了路子，原来是这样：

How do I make my Electron app the default for opening files?

关键词fileAssociations,在electron-build中配置即可让自己的应用关联相关后缀类型的文件，那么就可以设置为相关类型文件的默认打开方式了。

electron-build中关于该配置的介绍：

https://www.electron.build/configuration/configuration

介绍的较为简略，并且仅介绍了如何配置，没有介绍相关获取文件信息的方式。

又经过一番检索，终于打通了这条路：

example-electron-file-association

关键函数:

// Attempt to bind file opening #2
app.on('will-finish-launching', () => {
  // Event fired When someone drags files onto the icon while your app is running
  app.on("open-file", (event, file) => {
    if (app.isReady() === false) {
      initOpenFileQueue.push(file);
    } else {
      windows.create(file);
    };
    event.preventDefault();
  });
});

是的，原来这样获取文件路径的，但这个是针对mac的，windows如何获取呢？

那就查看下electron官方文档关于open-file事件的说明吧：

事件'open-file' macos

这里有了最终答案，windows下通过process.argv获取路径。

到此，所有逻辑梳理通了，开发就完事了。

最终实现效果:

image

缺陷与计划：

目前最大的缺陷当然是打包后安装文件大小的问题，electron大家都知道...
如果还有时间会尝试使用下mini-electron、增加id与实际设备名称关联的配置（现在id实在看不出哪台设备）

完整代码

electron-apk-installer

安装包

electron包体积确实是个硬伤

apk-installer.exe

觉得还行给个 ☆ star 喔！thanks