微信小程序反编译之electron自动更新

微信小程序反编译之electron自动更新

月光魔力鸭

2020-07-08 09:46 阅读 1194 喜欢 0 electron autoupdate 微信小程序 反编译

前段时间做了个微信小程序反编译的小东西,不过因为功能不全,没加分包处理,正好处理下加上,又考虑到后续可能的更新情况,准备上手增加下更新功能。

解密文章: 微信小程序解密反编译之node实现 软件获取:https://shop.licran.com/index/detail/a5ec6165-7f4f-4b8e-bf39-51559ed48396.html

小东西

使用electron实现的微信小程序反编译的桌面软件,用来反编译从手机里面拿到的微信小程序的wxapkg 文件。 实现的功能:

功能表现

此处有个gif录制,展现功能

程序更新

目前没有增加自动更新功能,由于昨天才刚接触,只是增加了一个检查更新的主动触发功能。

检查更新

点击检查更新。

额,昨天更新了..我再重新安装个旧版本

更新日志..有点丑,没做美化

由于做的是本地更新,所以进度条没做..目前只做了个进度提醒,下载完成后会自动更新的。

程序更新思路

本来查了下electron的官方API,他有一个autoUpdater模块,结果搜了下文章,全是electron-updater的。这里就说下这个模块的。

首先,这个模块需要配合electron-builder打包来实现的。

大体思路:

上代码

/***
 * 处理程序更新事项
 */
const { autoUpdater } = require("electron-updater");


module.exports = function (mainWindow, ipcMain) {

    // 检测更新,在你想要检查更新的时候执行,renderer事件触发后的操作自行编写
    let uploadUrl = 'http://localhost:8888/';
    console.log(uploadUrl);
    const message = {
        error: '检查更新出错',
        checking: '正在检查更新……',
        updateAva: '检测到新版本,正在下载……',
        updateNotAva: '现在使用的就是最新版本,不用更新'
    }
    autoUpdater.autoDownload = false
    autoUpdater.setFeedURL(uploadUrl);
    // https://github.com/electron-userland/electron-builder/issues/1254
    // if (process.env.NODE_ENV === 'development') {
    //   autoUpdater.updateConfigPath = path.join(__dirname, 'default-app-update.yml')
    // } else {
    //   autoUpdater.updateConfigPath = path.join(__dirname, '../../../app-update.yml')
    // }
    autoUpdater.on('error', function (error) {
        mainWindow.webContents.send('notify', message.error)
    });
    autoUpdater.on('checking-for-update', function () {
        mainWindow.webContents.send('notify', message.checking);
    });
    autoUpdater.on('update-available', function (info) {
        mainWindow.webContents.send('updateInfo', info)
    });
    autoUpdater.on('update-not-available', function (info) {
        console.log('not availanble');
        console.log(info);
        mainWindow.webContents.send('notify', message.updateNotAva);
    });
    autoUpdater.on('download-progress', function (progressObj) {
        console.log('开始下载数据-----')
        console.log(progressObj)
        mainWindow.webContents.send('downloadProgress', progressObj)
    });
    autoUpdater.on('update-downloaded', function (event, releaseNotes, releaseName, releaseDate, updateUrl, quitAndUpdate) {
        ipcMain.on('isUpdateNow', (e, arg) => {
            console.log('开始更新')
            autoUpdater.quitAndInstall()
            mainWindow.destroy()
            // callback()
        })
        mainWindow.webContents.send('isUpdateNow')
    })
    ipcMain.on('downloadUpdate', () => {
        // 下载
        console.log('开始下载')
        autoUpdater.downloadUpdate()
      })
    ipcMain.on('checkUpdate', (event, arg) => {
        autoUpdater.checkForUpdates();
    })
}

前端页面代码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>微信小程序反编译工具</title>
    <link rel="stylesheet" href="plugins/index.css">
</head>

<body>
    <div class="header"></div>
    <div class="content">
        <span class="btn" id="btn">选择微信小程序wxpkg</span>
        <span class="btn" style="margin-top:30px;" id="btn2">选择微信小程序分包wxpkg</span>
        <input type="hidden" name="subpath" value="">
        <span class="update"><a href="javascript:;" id="btn3">检查更新</a></span>
    </div>
    <footer class="footer">
        <!-- <p>xxxxx.com</p> -->
    </footer>
</body>

</html>
<script src="plugins/jquery-1.9.1.min.js"></script>
<script src="plugins/layer/layer.js"></script>
<script>
    const { ipcRenderer, shell } = require('electron')
    ipcRenderer.on('notify',(event,arg)=>{
        layer.msg(arg);
    });
    ipcRenderer.on('updateInfo',(event,arg)=>{
        //进行提示是否更新
        layer.open({
            type : 1,
            title : '软件更新',
            btn : ['确认更新','取消'],
            content : arg.message.replace(/\\\\n/g,'<br />'),
            area : ['80%','80%'],
            yes : function(index){
                layer.closeAll();
                layer.load(1);
                layer.msg('准备下载')
                ipcRenderer.send('downloadUpdate')
            },
            cancel : function(){
            }
        });
    })
    ipcRenderer.on('downloadProgress',(event,arg)=>{
        console.log(arg);
        layer.msg(parseInt(arg.percent)+'%',{shade : 0.3,time:300000});
    })
    ipcRenderer.on('isUpdateNow',(event,arg)=>{
        console.log('下载完毕,准备更新')
        ipcRenderer.send('isUpdateNow');
    })
    ipcRenderer.on('anafail', (event, arg) => {
        layer.closeAll();
        layer.alert('未选择文件', { title: false });
    })
    ipcRenderer.on('openFileSuc',(event,arg)=>{
        console.log(arg);
        layer.load(2);
        ipcRenderer.send('anafile',{filePath : arg})
    })
    ipcRenderer.on('anafail2', (event, arg) => {
        layer.closeAll();
        layer.alert('未选择文件', { title: false });
    })
    ipcRenderer.on('openFileSuc2',(event,arg)=>{
        console.log(arg);
        layer.load(2);
        var folderPath = $('[name="subpath"]').val();
        ipcRenderer.send('anafile2',{filePath : arg,folderPath : folderPath})
    })
    ipcRenderer.on('anasuc', (e, a) => {
        $('input[name="subpath"]').val(a);//将此数据放在分包数据zhong
        layer.closeAll();
        layer.alert('解析完毕,请在原路径查看', { title: false }, function () {
            layer.closeAll();
            shell.showItemInFolder(a);
        });
    });
    ipcRenderer.on('anasuc2', (e, a) => {
        layer.closeAll();
        layer.alert('解析完毕,请在原路径查看', { title: false }, function () {
            layer.closeAll();
            shell.showItemInFolder(a);
        });
    });
    document.getElementById('btn').onclick = function () {
        ipcRenderer.send('openFile');
    }
    document.getElementById('btn2').onclick = function () {
        var subpath = $('[name="subpath"]').val();
        if(subpath == ''){
            layer.alert('请先选择主包后再选择分包');
            return;
        }
        ipcRenderer.send('openFile2');
    }
    document.getElementById('btn3').onclick = function(){
        ipcRenderer.send('checkUpdate');
    }
</script>

注意

在更新的时候会报错,我在项目中新建了一个文件dev-app-update.yml,内容如下:

provider: generic
url: 'http://127.0.0.1:8888/'

等全部调试完毕后,还需要将新版本提交到服务端,并永久提供一个可下载的服务.. 不过考虑到我服务器这小水管,要不要提交到oss呢?? 不知道是否可行,有空验证下看看。

微信小程序反编译软件下载: https://shop.licran.com 可以下载...不过要花钱的哦 ヾ(o◕∀◕)ノヾ

转载请注明出处: https://chrunlee.cn/article/electron-auto-update-of-wxapp.html


感谢支持!

赞赏支持
提交评论
评论信息 (请文明评论)
暂无评论,快来快来写想法...
推荐
有一个需求,需要公司的LOGO信息,但是没有,只有公司的名字,想着先生成个默认的(本来是可以通过前端判断然后合成的..但是不想改小程序了),于是开始准备处理。
获取文件夹内所有的文件。支持递归获取、异步或同步、过滤、返回信息处理。
之前在知乎上有看到,基本上都是一致的,这里提供一个nodejs版本的针对微信内dat文件进行处理恢复为图片的方法。
发布自己的nodejs应用后,需要进行管理,目前一般都pm2来进行管理,这里记录下常用的命令。
碰到个小需求,本来实现挺简单的,用的electron,开发模式下各种顺畅...半个小时就搞定了,结果倒在了electron打包上..这个坑我应该跳进来了好多次了..
由于只是做个测试,这里使用了expresss简单搭建了个后台服务,提供文件断点下载。
经常会遇到需要系统重启后自动执行的一些任务,在windows 上可以将对应的程序打包成service 然后自启动即可
最近有客户提出了这么一个需求:微信dat文件在解码后的图片无法按照时间进行排序。 是的,解码后的文件的时间都是解码的时间,由于软件比较多,当时没做自动更新,所以在这里做一个小工具,可以将对应的解码后的图片的时间修改为微信dat文件对应的时间