实践微信小程序代码包获取

1,683 阅读4分钟
前提:朋友要设计图,丢给我一个小程序,要里面的所有图片

产品图.png

一、开始整活儿:抓包看请求,找到返回数据的图片(charles的基本操作就不介绍了)

图片请求.png

以上操作写个循环打开图片保存即可拿到小程序中间的图片,喜滋滋告诉朋友。被反问:Tabbar的图片呢?小的icon图标的?

二、怎么拿到项目中的图片呢。百度一波,得到基本思路:要先拿到程序代码包。

警示: 不要用mac电脑,mac上安装的夜神模拟器拿到小程序apkg程序包后使用共享目录同步到mac电脑没生效;夜神上安装qq想发送到qq好友上,也发不出去;操作也非常不方便,使用手指滚动就看不到顶部了,要一根手指滑动右侧滚动条小心翼翼操作,非常难受

方法一:直接在电脑上取加密包,再解密成程序包,最后变成代码。

解密工具 备用解密工具

(1). 登录微信电脑版,运行需要提取源码的小程序,程序会在【C:\Users\xxx\Documents\WeChat Files\Applet】目录下生成小程序的加密包__APP__.wxapkg。

(2). 将需要解密的程序目录导入解密工具进行解密,解密后会获得wxapkg程序包。

如下图,链接中的工具将__APP__.wxapkg(加密包)解密成了wx496e9b****.wxapkg(程序包)。程序包会在以上工具链接解压后的文件夹中

在电脑上拿加密包.png

方法二:通过模拟器直接拿到程序包

前提:准备一台windows电脑,安装夜神模拟器,windows支持模拟器和本机互传,非常方便

在模拟器中安装微信,登陆后打开微信小程序,就会在模拟器中这个目录下/data/data/com.tencent.mm/MicroMsg/16进制的随机字符/appbrand/pkg/下载下来该小程序的程序包。

我们使用虚拟机自带的文件管理器Amaze去看看(尝试使用RE管理器没有找到文件夹)

企业微信截图_e944ef20-33e2-4728-a385-fc22927acb7e.png

找到这个目录/data/data/com.tencent.mm/MicroMsg/16进制的随机字符/appbrand/pkg/,首先点击下面红色框框这里,

企业微信截图_0f9b14ac-9815-4662-9e69-1df1b06708bc.png

点击上面图片中的的路径后,就能回到根目录,然后就能看到data文件夹了,一步步往里面找到wxapkg,这就是代码程序包

企业微信截图_65cf59ed-1543-4a5f-bf66-e403a10341f2.png

最后就是通过互传把这两个wxapkg程序包拿出来,在模拟器右侧有个按钮可以看到共享路径。

企业微信截图_e60aa2ae-fc49-45b5-a90d-f66ce102f5b4.png

可以看到上图中安卓共享路径,将wxapkg复制到模拟器的共享路径下就可以在电脑上看到文件啦

复制.png

上图中选中文件后,点击上面的复制,然后地址到安卓的共享路径下,就可以在电脑中看到了

粘贴.png

通过以上两种方法,拿到wxapkg程序包文件后,接下来就要解密出代码

解密项目备用项目地址

下载上面的代码,放到D盘,从里面的issue中可以看到几个信息:

  1. 在电脑版微信上打开微信小程序能得到一个名为__APP__.wxapkg的加密包,直接使用上面的地址去解密代码是不行的。需要将其先解密成程序包,也就是第一种方式:直接在电脑上取加密包要解密先

  2. 代码中的nodejs/nodejs文件夹中有一个node_modeles.zip 要解压出来,我解压的时候出现了报错。

解压文件报错.png

没事,将zip复制出去到任意文件夹先解压,再拿进来就好了

解压成功.png

项目结构如下,简单操作,将第二步拿到的wxapkg放入wxapkg文件夹,运行exe就可以了

项目结构和使用方法.png

成功后会在wxapkg文件夹生成代码文件夹,选中要解密的包,成功如下图,没有done生成代码文件夹就都是不成功

成功生成.png

生成了对应的文件夹,一个是代码,一个是微信的基础包

文件夹就是代码.png

成功拿到代码了,里面就有所有图片

我们看代码截图,想要什么图片都有,项目中写的oss链接抓不到的也能看到啦

代码截图.png

到这里就结束了