我们知道,在微信开发者工具中开发完小程序后,点击“上传”按钮,微信开发者工具会进行“编译”,对 JS 代码进行压缩混淆以及对 wxml
、wxss
和资源文件等进行整合打包成一个 .wxapkg
文件上传给微信服务器。所以要“反编译”小程序,首先要获取到小程序对应的.wxapkg
包。我们从手机端入手,在手机上找到微信客户端下载保存在本地的小程序包。
获取小程序的 .wxapkg 文件
工具:一台已越狱的 iPhone 手机或者已 Root 的 Android 手机,本文以 iPhone 4S, iOS 8.4.1 为例,微信版本 v6.6.6。在已越狱的 iPhone 上打开 Cydia
,搜索并安装iFile
或者 Filza
等文件浏览 App,打开 iFile 或者 Filza,跳转到本地 App 安装目录:/var/mobile/Containers/Data/Application/
,此时,你可以看到当 iPhone 上已安装的 App 列表,如下图所示:
找到“微信”的目录(我手机上对应的是:297286CE-9055-400A-99FA-D2D7C0735DCF
文件夹),点击进入,即为微信在此 iPhone 上的“沙盒”(Sandbox),相信 iOS 开发者对此目录已经非常熟悉了,该目录下主要有
Documents
、Library
和 tmp
等文件夹,通常用于存放不同的数据和文件,这里不再赘述。我们在当前微信“沙盒”目录中搜索wxapkg
关键字,即可找到当前 iPhone 中微信已下载的小程序包,如下:
我们发现搜索到的 .wxapkg
文件名都是以数字命名的,如图中的
2.wxapkg
和25.wxapkg
,它们的命名有什么规则呢?又放在哪呢?接着往下看。经过简单分析我们发现,微信下载的小程序包存放在以下目录:
其中,{UserId}
为当前登录的微信账号 Id 的 MD5 值(32 位字符串),例如我手机上小程序包存放的完整目录为:
该目录的内容如下图所示:
目录中有一系列以 wx...
开头的文件夹,这些 wx… 的 18 位字符串即为每个小程序对应的 AppId,在每个 wx… 文件夹中都放着当前小程序对应的 .wxapkg
包,它以数字命名,数字代表着当前包为开发者第几次发布的(它与开发者在发布小程序时指定的版本号是不同的),例如我们的“知识小集”小程序一共发布了两个版本,所以wx48...85db
文件中存放有2.wxapkg
文件:
另外,我们发现,在 iOS 上,微信也为每个小程序分配了一个 Sandbox
文件夹用于管理小程序在本地存储的数据和文件,如图:
其路径为:
By The Way,Android 手机上小程序包的存放目录为(需 Root 权限才能访问):
拷贝 .wxapkg 文件到电脑上
通过上述分析,我们可以知道到小程序的压缩包 .wxapkg
存放在哪,接下来需要将手机上的.wxapkg
文件拷贝到电脑上。
在 iPhone 上打开Cydia
搜索并安装OpenSSH
后,在iPhone > 设置 > 无线局域网
中查看你当前手机连接的 WiFi,并记录 IP 地址,例如我的为:192.168.1.17
,然后在你的 Mac 电脑上打开终端(与 iPhone 连接同一 WiFi),就可以通过 SSH 登录到你的手机上了(具体的细节详见 Cydia 上 OpenSSH 下载页面的使用说明):
接下来就可以通过 scp
命令从 iPhone 上拷贝文件到我们的电脑上了,例如,在我的 Mac 上的命令行里执行(不需要ssh
登录到 iPhone 上,直接在 Mac 的终端上执行):
就可以把“知识小集”小程序的包2.wxapkg
拷贝到 Mac 桌面上的 WeApp 文件夹中了。
当然,如果你的电脑有安装 iTool 或者 PP 助手 之类的工具,当连接已越狱的 iPhone 好像可以直接访问手机上的目录和文件,可能就不用这么麻烦了(未验证)。
.wxapkg 解包
上述费了很大周折终于拿到每个小程序的.wxapkg
包,接下来可以对它进行分析了。首先.wxapkg
文件到底是什么呢?你可能会认为它就是类似 Android 的.apk
或者 iOS 的.ipa
安装包,本质上是一个 .zip 压缩包?其实不是的!,它是一个二进制文件,实际的文件结构如下图:
图片取自文章 微信小程序源码阅读笔记
http://lrdcq.com/me/read.php/66.htm
,同时此文章的作者也提供了解包的脚本(各种语言的)放在了 GitHub
https://github.com/leo9960/wechat-app-unpack
上:
我下载了 Python 2 的解包脚本,与 .wxapkg
文件放在一个目录,然后在命令行里执行如下命名即可得到解包后的文件:
以“知识小集”小程序为例,解包后得到的文件目录如下(已经基本与我开发“知识小集”小程序的工程目录一致了):
每个小程序解包后的文件都大同小异,主要包含如下文件:
app-service.js
:小程序工程中所有 JS 文件的汇总,已被混淆;app-config.json
: 小程序工程app.json
以及各个页面的 JSON 配置文件汇总,可直接查看;page-frame.html
: 所有页面的.wxml
和app.wxss
样式文件的汇总,可读性差,需要还原;*.html
: 包含每个页面对应的.wxss
信息,可读性较好;资源文件
: 各类图片、音频等资源文件;
总结
本文主要介绍了如何获取小程序的.wxapkg
包文件,以及如何解包获得小程序“编译”混淆后的代码和资源文件。在下一篇文章《微信小程序“反编译”实战(二):源码还原》将介绍如何将.wxapkg
包内内容还原为"编译"前的内容。
参考链接
看雪论坛:
https://bbs.pediy.com/thread-225289.htm
V2EX:
https://www.v2ex.com/t/419056
GitHub:
https://github.com/leo9960/wechat-app-unpack
评论