1. 程式人生 > 其它 >獲取線上微信小程式原始碼

獲取線上微信小程式原始碼

獲取線上微信小程式原始碼(反編譯)

看到人家上線的小程式的效果,純靠推測,部分效果在絞盡腦汁後能做出大致的實現,但是有些細節,費勁全力都沒能做出來。很想一窺原始碼?檢視究竟?看看大廠的前端大神們是如何規避了小程式的各種奇葩的坑?那麼趕緊來試試吧

認識一下.wxalikg檔案

先來想想一個很簡單的問題,小程式的原始檔存放在哪?

當然是在微信的伺服器上

  • 但是在微信伺服器上,普通使用者想要獲取到,肯定是十分困難的,有沒有別的辦法呢?
  • 簡單思考一下我們使用小程式的場景就會明白,當我們點開一個微信小程式的時候,其實是微信已經將它的從伺服器上下載到了手機,然後再來執行的。所以,雖然我們沒能力從伺服器上獲取到,但是我們應該可以從手機本地找到到已經下載過的小程式原始檔

那麼如何才能在手機裡找到小程式的原始檔包呢?

  • 具體目錄位置直接給出:/data/data/com.tencent.mm/MicroMsg//alilibrand/likg/

  • 在這個目錄下,會發現一些 xxxxxxx.wxalikg 型別的檔案,這些就是微信小程式的包,微信小程式的格式就是:.wxalikg,.wxalikg是一個二進位制檔案,有其自己的一套結構。關於.wxalikg的詳細內容可以參考lrdcq大神的博文: 微信小程式原始碼閱讀筆記

  • 但是這裡有個坑,想要進入到上面這個目錄的話,用手機自帶的檔案管理器肯定是不行的,安卓或者ilihone都要要用到第三方的檔案管理器,比如:RE檔案管理器,並且安卓需要取得root許可權,而蘋果手機肯定是要越獄的,且iPhone的越獄難度>>安卓獲取root,不管越獄還是root,這都太費勁(也讓手機系統存在一定安全和穩定性破壞風險),當然有能力的同學可以直接從手機上來操作,但是這裡不推薦從真機上獲取。

準備工作

node.js執行環境 下載地址

  • 如果沒有安裝nodejs,請先安裝一下

  • 反編譯的指令碼。下載地址 這裡提供一個Github上qwerty472123大神寫的node.js版本的,當然也有其它版本的,你也可以去嘗試,其實對我們來說重點是怎麼提取出手機裡的快取檔案,這裡我只是簡單地用node.js版本舉例

  • 安卓模擬器(要求自帶root許可權)下載地址自行百度

  • 我使用的是夜神模擬器,用來獲取小程式原始檔,感覺很不錯,UI做的挺好,重點是自帶root許可權,你把RE管理器下載好開啟自動就會獲取許可權,並且支援mac系統

但值得說明的是mac版本你不一定能裝成功,官方也沒好的解決辦法,結合我自己安裝經驗有兩點,一:安裝時候會有個提示彈窗一堆英文,有兩個按鈕,一個‘open xxx’,另一個是個'OK',你應該點選到open,進去會有提示給許可權,把夜遊神需要的許可權給予,然後再繼續。二:如果安裝失敗,你可以重啟電腦再試,我就是重啟後再裝成功了

  • RE管理器 下載地址自行百度,也可以用我網盤裡的

  • 下載好RE管理器直接拖到模擬器中,會自動安裝,開啟時候自動就會獲取許可權,允許授權即可

詳細步驟

  • 使用安卓模擬器獲取到.wxapkg檔案

  • 不用越獄,不用root,使用電腦端的安卓模擬器來獲取是一個非常簡單快捷且萬能的獲取方式,具體步驟如下:

  • 開啟安裝好的安卓模擬器,並在模擬器中安裝QQ、微信、RE管理器

  • QQ、微信在模擬器自帶的應用商店裡搜尋下載安裝即可

  • 下載好後直接拖拽進開啟的模擬器視窗就會自動安裝

  • 設定一下模擬器

  • 以我個人認為比較好用的夜神模擬器舉例

  • 首先到模擬器內部設定超級使用者許可權

  • 這些操作的目的都是為了能讓RE管理器順利的獲取到ROOT許可權

  • 接下來在模擬器裡開啟微信,然後在微信中執行你想要獲取的下程式(這其實是讓微信把小程式的原始檔包從伺服器下載到了本地了)

  • 就以我說的這款今日頭條的小程式舉例

  • 在模擬器微信中執行“今日頭條的小程式”一下後,直接切回模擬器桌面執行RE瀏覽器 來到目錄/data/data/com.tencent.mm/MicroMsg/appbrand(類似一個a8b3488516c9d81e1d5f511891583cf9檔案,別的教程是不會告訴你的)/pkg/就抵達了目的資料夾

  • 你會看到發現裡面的一些.wxapkg字尾的檔案,就是它們沒錯啦,可以根據使用的時間來判斷那個是你剛才從伺服器下載過來的,一般小程式的檔案不會太大(一般會有2-3個檔案,那個大小達到1-2M的不是,你都可以反編譯出來看看),可以結合時間來判斷,長按壓縮所選檔案,然後再將壓縮好的包通過QQ傳送到我的電腦,如果不進行壓縮的話,是無法將這個檔案通過QQ來發送的。所以QQ的這個功能可以讓我們很方便的拿到原始檔,而不必到電腦目錄去找模擬器的檔案目錄。解壓。這樣幾步簡單操作,就成功拿到了小程式的原始檔了。

使用反編譯指令碼解包 wxapkg

到這裡你應該已經將反編譯指令碼從github下載或者clone到本地某個目錄(建議採用此種方式gitee上下載反編譯包)

  • 開啟nodejs命令視窗,按住shift+右擊

  • cd 到你clone或者下載好的反編譯指令碼目錄下

  • 在node命令視窗中依次安裝如下依賴(當然,你也可以選擇-g全域性安裝):

1、npm install esprima

2、npm install css-tree

3、npm install cssbeautify

4、npm install vm2

5、npm install uglify-es

6、npm install js-beautify
  • 安裝好依賴之後,就是最後一步了,反編譯 .wxapkg 檔案
    在當前目錄下輸入 node wuWxapkg.js [-d] //files 就是你想要反編譯的檔名 例如:我有一個需要反編譯的檔案 _163200311_32.wxapkg 已經解壓到了C盤根目錄下,那麼就輸出命令 node wuWxapkg.js C:_163200311_32.wxapkg

  • 回車執行,反編譯指令碼就能一步將.wxapkg 檔案還原為微信開發者工具能夠執行的原始檔,目錄地址和你反編譯的檔案地址是一樣的 然後在微信開發者工具新增專案即可開啟?

不,注意,截止到目前並沒完全結束,你現在開啟肯定是不成功的,因為編譯後的檔案是不帶appid專案配置檔案的,因此,你需要註冊個微信小程式開發者賬號,然後生成一個小程式,接著專案中會有一個project.config.json檔案,直接拿到當前原始碼中即可,並且你需要在小程式開發者工具中勾選https校驗。另外值得一提的是,編譯後的檔案會經過專業格式化外掛格式化,.js檔案原始碼的var、let、const變數名字會替換成a、b、c這種命名形式。到此,整個教程完全結束!

參考
獲取微信小程式原始碼 手把手-獲取微信小程式原始碼 反編譯

人生有很多自己在意的事,但是要學會不介意!