精华内容
下载资源
问答
  • 微信小程序反编译 wxss 丢失问题

    千次阅读 2020-12-06 12:15:27
    鉴于同事执行了删除代码的疯狂操作,并多次覆盖后,硬盘恢复文件的几率几乎为零,只能另辟蹊跷,所幸之前看到过微信小程序反编译的一篇文章。通过简单的搜索,就找到了相关的文章。根据文章所写,其他的都还算顺利,...

    鉴于同事执行了删除代码的疯狂操作,并多次覆盖后,硬盘恢复文件的几率几乎为零,只能另辟蹊跷,所幸之前看到过微信小程序反编译的一篇文章。通过简单的搜索,就找到了相关的文章。根据文章所写,其他的都还算顺利,但是样式文件就迟迟弄不出来。

    微信小程序反编译可以参考

    https://github.com/qwerty472123/wxappUnpacker

    1执行wxss反编译程序后获得如下错误:

    Guess wxss(first turn)...
    
    /Users/aimuz/workspace/web/wxappUnpacker/node_modules/vm2/lib/main.js:214
                throw this._internal.Decontextify.value(e);
                ^
    ReferenceError: $gwx is not defined
        at vm.js:3:3
        at Script.runInContext (vm.js:134:20)
        at VM.run (/Users/aimuz/workspace/web/wxappUnpacker/node_modules/vm2/lib/main.js:208:72)
        at runVM (/Users/aimuz/workspace/web/wxappUnpacker/wuWxss.js:69:6)
        at runOnce (/Users/aimuz/workspace/web/wxappUnpacker/wuWxss.js:86:27)
        at Array.preRun (/Users/aimuz/workspace/web/wxappUnpacker/wuWxss.js:166:5)
        at CntEvent.decount (/Users/aimuz/workspace/web/wxappUnpacker/wuLib.js:17:43)
        at ioLimit.runWithCb (/Users/aimuz/workspace/web/wxappUnpacker/wuLib.js:81:11)
        at agent (/Users/aimuz/workspace/web/wxappUnpacker/wuLib.js:54:14)
        at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:53:3)

    在翻阅相关的资料后,发现不少人遇到了相同的问题

    这简直和我的一毛一样啊。可惜没有解决方法。

    偌大的互联网竟然还没有人找到解决问题。😞

    2 分析文件

    到了这里可以确认,微信小程序官方应该对小程序进行了升级,导致原反编译工具失效。可是这并不能为难我胖虎,通过

    http://jsnice.org/工具对page-frame.html

    进行简单的反混淆后。获得了较为清晰的文件

    通过仔细阅读代码后发现了page-frame.html文件,包含了样式信息。

    __wxAppCode__['components/menu/menu.wxss'] = setCssToHead([".", [1], "menuBox{ width: 100%; height: ", [0, 100], "; position: fixed; bottom: ", [0, 0], "; left: ", [0, 0], "; display: -webkit-flex; display: flex; background: #fff; padding-top: ", [0, 10], "; border-top: ", [0, 2], " solid #ccc; }\n.", [1], "menuBox .", [1], "menu{ width: ", [0, 250], "; text-align: center; font-size: ", [0, 22], "; color: #8a8a8a }\n.", [1], "menuBox wx-image{ width: ", [0, 50], "; height: ", [0, 50], "; }\n.", [1], "menuBox .", [1], "menu wx-view{ }\n",], undefined, { path: "./components/menu/menu.wxss" });

    setCssToHead函数 定义

    var setCssToHead = function (file, _xcInvalid, info) {

    通过查看setCssToHead函数,发现其中有一个makeup方法,这个方法是对原来的wxss中rpx进行单位转换,换成通用型的px。

    makeup 方法相关的代码

    function makeup(file, opt) {
        var _n = typeof(file) === "number";
        if (_n && Ca.hasOwnProperty(file)) return "";
        if (_n) Ca[file] = 1;
        var ex = _n ? _C[file] : file;
        var res = "";
        for (var i = ex.length - 1; i >= 0; i--) {
            var content = ex[i];
            if (typeof(content) === "object") {
                var op = content[0];
                if (op == 0) res = transformRPX(content[1], opt.deviceWidth) + "px" + res;
                else if (op == 1) res = opt.suffix + res;
                else if (op == 2) res = makeup(content[1], opt) + res;
            } else res = content + res
        }
        return res;
    }

    在这之后又找到了一个rewritor
    rewritor相关代码

    var rewritor = function(suffix, opt, style) {
        opt = opt || {};
        suffix = suffix || "";
        opt.suffix = suffix;
        if (opt.allowIllegalSelector != undefined && _xcInvalid != undefined) {
            if (opt.allowIllegalSelector) console.warn("For developer:" + _xcInvalid);
            else {
                console.error(_xcInvalid + "This wxss file is ignored.");
                return;
            }
        }
        Ca = {};
        css = makeup(file, opt);
        if (!style) {
            var head = document.head || document.getElementsByTagName('head')[0];
            window.__rpxRecalculatingFuncs__ = window.__rpxRecalculatingFuncs__ || [];
            style = document.createElement('style');
            style.type = 'text/css';
            style.setAttribute("wxss:path", info.path);
            head.appendChild(style);
            window.__rpxRecalculatingFuncs__.push(function(size) {
                opt.deviceWidth = size.width;
                rewritor(suffix, opt, style);
            });
        }
        if (style.styleSheet) {
            style.styleSheet.cssText = css;
        } else {
            if (style.childNodes.length == 0) style.appendChild(document.createTextNode(css));
            else style.childNodes[0].nodeValue = css;
        }
    }

    并发现setCssToHead最后就是返回了rewritor 方法,由此以及根据上述代码可以猜出,该方法应该主要是还原wxss文件。

    3 分析代码

    rewritor拥有三个参数,阅读代码可以得出suffix参数是给样式添加前缀,例如原来样式名是abc,suffix参数是,那么会拼接成.aabc

    opt看代码结构应该是一个对象

    style应该是一个document.node的对象。

    通过浏览器直接打开page-frame.html文件,在控制台中输入__wxAppCode__['components/menu/menu.wxss'], 看看其返回值

    WX20190123-104403@2x.png

    看出,确实是返回一个方法,先不传任何参数,再次输入测试__wxAppCode__['components/menu/menu.wxss']()

    WX20190123-104540@2x.png

    直接返回了undefined

    由此说明参数应该必填的,现在输入正确的参数类型尝试__wxAppCode__['components/menu/menu.wxss']("",{},document.body)

    WX20190123-105904@2x.png

     

     

    把代码复制到小程序中,🙃,像素比例竟然放大了。再次翻看一下代码,rewritor又调用了makeup方法,并且用到了设备宽度

    改变浏览器宽度后,确实发生了改变

    .menuBox{ width: 100%; height: 50px; position: fixed; bottom: 0px; left: 0px; display: -webkit-flex; display: flex; background: #fff; padding-top: 5px; border-top: 1px solid #ccc; }
    .menuBox .menu{ width: 125px; text-align: center; font-size: 11px; color: #8a8a8a }
    .menuBox wx-image{ width: 25px; height: 25px; }
    .menuBox .menu wx-view{ }

    把设备宽度调成了iPhone 6的宽度,然后复制小程序里面

    再把代码过了一遍之后,了解到opt会使用到一个 deviceWidth 属性,传入iPhone 6的宽度像素,也得到了

    __wxAppCode__["pages/index/cardDetail/carsDetail.wxss"]("",{deviceWidth:375},document.body)

    wxss 代码

    .menuBox{ width: 100%; height: 50px; position: fixed; bottom: 0px; left: 0px; display: -webkit-flex; display: flex; background: #fff; padding-top: 5px; border-top: 1px solid #ccc; }
    .menuBox .menu{ width: 125px; text-align: center; font-size: 11px; color: #8a8a8a }
    .menuBox wx-image{ width: 25px; height: 25px; }
    .menuBox .menu wx-view{ }

    但是这个只能在iPhone 6上适配啊,需要改成rpx,方能适配其他的设备终端。rpx和px 的转换公式,

    rpx = px * 2
    px = rpx / 2

    微信相关文档:
    https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxss.html#wxss

    经过转换后,问题就完美解决了。

    本文链接:https://aimuz.me/wei-xin-xiao-cheng-xu-fan-bian-yi-wxss-diu-shi-wen-ti.html

    展开全文
  • 微信小程序升级版反编译工具百度下载地址(内含夜神模拟器和RE工具): 链接: https://pan.baidu.com/s/1XUhx0PISXjJbxjE6p2sdPA 密码:aqd2 分享一下我做的小项目,一个动漫头像制作小工具【动漫头像生成】,...

    安装node.js

    如果没有安装nodejs,请先安装一下
    下载地址:https://nodejs.org/en/

    下载安装模拟器(要求自带root权限)

    可以使用夜神模拟器nox_setup_v6.2.8.3_full.exe,你也可以自选
    下载地址:https://www.yeshen.com/cn/download/fullPackage

    安装RE工具Root_Explorer

    这个可以在应用商店或者文章末尾分享的百度云里下载

    下载小程序pkg文件

    使用模拟器登录微信,打开需要访问的小程序,可以会出现闪退的情况(现在微信屏蔽了模拟器打开小程序,这个不要紧,pkg文件已经下载下来了),
    进入RE工具,访问/data/data/com.tencent.mm/MicroMsg/{User}/appbrand/pkg下得到最新的小程序包._***.wxapkg({User}是一串16进制的数字,每个用户都不同),长点击压缩为zip或rar,发送给朋友(另一个微信号,若没有可以按照qq传输)

    下载反编译脚本

    这里提供一个Github上qwerty472123大神写的node.js版本的
    地址:https://github.com/qwerty472123/wxappUnpacker
    下载下来后,进行解压,将需要反编译的pkg文件剪切过来,让反编译脚本与pkg文件处于同一目录下载,
    接着打开命令行,进入到脚本目录,安装所需要的依赖包

    npm install esprima -g
    npm install css-tree -g
    npm install cssbeautify -g
    npm install vm2 -g
    npm install uglify-es -g
    npm install js-beautify -g
    npm install escodegen -g
    

    安装完成后在命令行输入:

    node wuWxapkg.js xx.pkg
    

    反编译脚本就能一步将.wxapkg 文件还原为微信开发者工具能够运行的源文件,但是会出现一些错误,我们暂时可以不用管它,先使用微信开发者工具运行下小程序,打开后我们会发现样式是乱的,缺少wxss文件,

    wxss反编译不成功的解决方法

    这是由于反编译的脚本是2018年底的,2019年后微信升级了,需要修改下反编译脚本。找到wuWxml.js中的runVM方法,替换为如下js:

    function runVM(name, code) {
        let wxAppCode = {}, handle = {cssFile: name};
        let gg = new GwxCfg();
        let tsandbox = {
            $gwx: GwxCfg.prototype["$gwx"],
            __mainPageFrameReady__: GwxCfg.prototype["$gwx"],
            __wxAppCode__: wxAppCode,
            setCssToHead: cssRebuild.bind(handle)
        };
        let vm = new VM({sandbox: tsandbox});
        vm.run(code);
        for (let name in wxAppCode) if (name.endsWith(".wxss")) {
            handle.cssFile = path.resolve(frameName, "..", name);
            wxAppCode[name]();
        }
    }
    

    注意:很可能在出现$gwx is not defined错误之前,先出现__vd_version_info__。
    我们观察小程序的流程页page-frame.html

    if (__vd_version_info__.delayedGwx) __wxAppCode__['pages/create/index.wxml'] = [ $gwx, './pages/create/index.wxml' ];    else __wxAppCode__['pages/create/index.wxml'] = $gwx( './pages/create/index.wxml' );
    

    出现很多次如上js.发现__vd_version_info__就是多此一举,只需要把if (vd_version_info.delayedGwx) wxAppCode[‘pages/create/index.wxml’] = [ $gwx, ‘./pages/create/index.wxml’ ];
    else 这个条件判断删除就可以。

    微信小程序升级版反编译工具百度下载地址(内含夜神模拟器和RE工具):
    链接:https://pan.baidu.com/s/1XUhx0PISXjJbxjE6p2sdPA
    密码:aqd2

    分享一下我做的小项目,一个动漫头像制作小工具【动漫头像生成】,大家有什么问题,可以留言共同交流。

    展开全文
  • 反编译步骤 第一步:安装node.js 如果没有安装nodejs,请先安装一下 下载地址:https://nodejs.org/en/ 第二步:下载安装模拟器(要求自带root权限) 可以使用夜神模拟器nox_setup_v6.2.8.3_full.exe,你也可以自选...

    反编译步骤

    第一步:安装node.js

    如果没有安装nodejs,请先安装一下

    下载地址:https://nodejs.org/en/
    

    第二步:下载安装模拟器(要求自带root权限)

    可以使用夜神模拟器nox_setup_v6.2.8.3_full.exe,你也可以自选

    下载地址:https://www.yeshen.com/cn/download/fullPackage
    
    以及RE工具:Root_Explorer-v4.2.4(3.0 )-Origin_icon_group-Patched_by_Alphaeva.apk
    

    在模拟器里登陆微信,访问小程序:

     在Android 手机最近使用过的微信小程序所对应的 wxapkg 包文件
     都存储在特定文件夹
     /data/data/com.tencent.mm/MicroMsg/{User}/appbrand/pkg下
     得到最新的小程序包._***.wxapkg
    
    长点击压缩为zip或rar,发送给朋友(另一个微信号,若没有可以按照qq传输)
    

    第三步:下载反编译脚本

    这里提供一个Github上qwerty472123大神写的node.js版本的,当然也有其它版本的,例如python版本,这里只是简单地用node.js版本举例

     地址:https://github.com/qwerty472123/wxappUnpacker
    
    反编译脚本为wxappUnpacker-master.zip的下载目录,
    加压后,进入改目录shift+鼠标右键进入当前目录的cmd命令。
    
    把第二步得到的小程序包_***.wxapkg加压到该目录,
    
    然后依次执行Node依赖的依赖于以下包:
    cssbeautify、CSSTree、VM2、Esprima、UglifyES、js-beautify。
    
    具体为:
    
    npm  install cssbeautify
    
    npm  install CSSTree
    
    npm  install VM2
    

    核心一:Cannot find module '*

    缺少什么类,就npm  install执行它。
    

    核心二: $gwx is not defined

    这是由于反编译的脚本是2018年底的,2019年后微信升级了,需要修改下反编译脚本。
    
    找到wuWxml.js中的runVM方法,替换为如下js:
    
    function runVM(name,code){
    
    let wxAppCode={},handle={cssFile:name};
    
    let gg = new GwxCfg();
    
    let tsandbox =  
     {$gwx:GwxCfg.prototype["$gwx"],__mainPageFrameReady__:GwxCfg.prototype["$gwx"],__wxAppCode__:wxAppCode,setCssToHead:cssRebuild.bind(handle)};
    
    let vm = new VM({sandbox:tsandbox});
    
    vm.run(code);
    
    for(let name in wxAppCode)if(name.endsWith(".wxss")){
    
    handle.cssFile=path.resolve(frameName,"..",name);
    
    wxAppCode[name]();
    
    }
    
    }
    

    微信小程序升级版反编译工具百度下载地址(内含夜神模拟器和RE工具):

    链接:https://pan.baidu.com/s/1YtfH9aeVkBG365N-Fvx9XQ
    
    提取码:rdeh
    

    注意:很可能在出现$gwx is not defined错误之前,先出现__vd_version_info__。

    我们观察小程序的流程页page-frame.html

    if (__vd_version_info__.delayedGwx) __wxAppCode__['pages/create/index.wxml'] = [ $gwx, './pages/create/index.wxml' ];
    
    else __wxAppCode__['pages/create/index.wxml'] = $gwx( './pages/create/index.wxml' );
    
    出现很多次如上js.
    
    发现__vd_version_info__就是多此一举,只需要把if (__vd_version_info__.delayedGwx) __wxAppCode__['pages/create/index.wxml'] = [ $gwx, './pages/create/index.wxml' ];
    
    else 这个条件判断删除就可以。
    
    展开全文
  • 如果你反编译时发现wxss文件丢失,执行wuWxss.js报上面错误,执行wuWxapkg.js 后只有page-frame.html 然后页面文件里面只有js、json、wxml、html文件,就是没有wxss样式文件的话,那么这个方法对你有帮助,由于上一...

    ..............wxappUnpacker\wuLib.js:117
                    if (err) throw Error("Scan dir error: " + err);

     

    如果你反编译时发现wxss文件丢失,执行wuWxss.js报上面错误,执行wuWxapkg.js 后只有page-frame.html  然后页面文件里面只有js、json、wxml、html文件,就是没有wxss样式文件的话,那么这个方法对你有帮助,由于上一个版本公布出来以后可能被微信的小伙伴看到,然后更换了加密方式,以至于后来很多反编译后出现wxss丢失的问题,这次我不打算把方法公布出了,可以加在下的微信私聊:wodweixinhao ,加微信的暗号为:“技术咨询”。

    PS:我一般晚上才有时间,白天要上班,若有怠慢之处请各位小伙伴海涵~!

     


     

    展开全文
  • 微信小程序反编译整理,wxss不成功

    千次阅读 2020-08-17 16:19:01
    微信小程序反编译搞了一下午,终于搞成,简单做个整理。 网上大部分资料可参考。 1.安装好node (大部分人应该早装了)。 2.网上大部分推荐的 夜神模拟器 。 3.可以电脑上 下载个 RE资源管理器安装包 ,微信app安装包...
  • 因为想研究某小程序的某功能实现,因此打算把小程序反编译,来研究一下源码 网上搜索发现了项目:wxappUnpacker 根据项目文档操作,拿到小程序wxapkg包,使用node wuWxapkg.js ../gw.wxapkg 开始反编译 中途报错: ...
  • 微信小程序反编译.zip

    2020-12-21 11:48:55
    微信小程序反编译脚本和操作命令,附带一个安卓模拟器和文件管理工具
  • 查阅各种资料,最终解决,于是贴上完整的微信小程序反编译方案与教程。 本文章仅作学习使用。 微信小程序反编译截图1 微信小程序反编译截图2 ------ 常见的微信小程序反编译失败问题 ----- 1 获取不到...
  • 微信小程序代码编译获取工具/微信小程序代码编译获取工具/微信小程序代码编译获取工具/微信小程序代码编译获取工具
  • 微信小程序反编译详细步骤

    千次阅读 2020-05-06 15:28:16
    微信小程序反编译 将.wxapkg还原成.wxss, .json, .wxs, .wxml 下面是反编译的德邦快递小程序 一、获取微信小程序源码包 电脑端下载夜神模拟器,安装微信、RE管理器 使用微信打开你要反编译的小程序 打开你...
  • 微信小程序反编译

    2021-03-20 15:04:53
    微信打开要反编译小程序连接。 点击打开后,微信会自动下载这个小程序。 adb命令连接mumu模拟器 mac命令 adb kill-server && adb server && adb shell windows命令 adb connect 127.0.0.1:...
  • Wechat App(微信小程序, .wxapkg)解包及相关文件(.wxss, .json, .wxs, .wxml)还原工具 欢迎大家使用本程序解包一些开源或经作者授权的小程序包供学习小程序编写或供在电脑端使用小程序或通过研究本项目代码来了解小...
  • 本实践教程将一步步告诉你如何“反编译”获得其它小程序的源代码,包括“解包”和“源码还原”两篇,主要参考了看雪论坛、V2EX、GitHub 等网站上的帖子、教程、工具,在此不胜感激,参考链接详见文章底部,以及加上...
  • 微信反编译支持最新编译wxss完美编译,完美编译wxss
  • 该工具包用于反编译微信小程序包(已更新过,亲测可用),获得微信小程序的源码用于学习,修复分包、解包后部分文件丢失以及编译后没有wxml、wxss文件问题。
  • 微信小程序反编译工具 微信小程序解包及相关文件(.wxss, .json, .wxs, .wxml)还原工具 反编译步骤 提前获取wxapkg 包文件,存储在特定文件夹下 下载此工具包 执行 npm install命令 ; 再执行反编译命令:node ...
  • 获取微信小程序wxapkg文件,其实获取wxapkg文件的教程很多,这里就简单描述一下。 下载雷电安卓模拟器 安装后通过雷电的应用市场安装re文件管理器和微信 通过re文件管理器获取小程序wxapkg文件。 获取路径:/data/...
  • Wechat App(微信小程序, .wxapkg)解包及相关文件(.wxss, .json, .wxs, .wxml)还原工具 1. 说明 本文是基于 创作的。 修复 “ReferenceError: $gwx is not defined” 和 extract wxss 等问题 支持分包 支持一键...
  • 微信小程序反编译~2020年

    万次阅读 热门讨论 2020-07-13 04:37:07
    使用wxappUnpacker安装小程序反编译工具(2020.03)
  • 该压缩包为完整版,现在百度到的反编译压缩包大多数缺少某些文件,这个也是我自己找到的,试用过了,收集不易。之前有部分兄弟说没有用,现在改成免费。
  • 要想拿到微信小程序源码,找到源文件在手机存放的位置就行,源文件拿到,用反编译脚本跑一下,微信小程序代码包里的所有文件、所有资源就出来了(除了project.config.json小程序配置文件)。 二、所需工具 1.夜神...
  • wxappUnpacker 微信小程序反编译 逆向 2019使用问题总结 问题一:Cannot find module 'uglify-es' npm install esprima --save npm install css-tree --save npm install cssbeautify --save npm install vm2 --...
  • 微信小程序反编译总结

    千次阅读 2020-06-13 23:05:34
    } } } 【未解决】反编译wxss文件时报错 SyntaxError: Unexpected end of input .wxapkg不是微信小程序的包 【报错】This package is unrecognizable 或者 not a directory, scandir 'D:\223\_1123949441_432\...
  • 看了很多反编译、找回微信小程序源码很多教程,各种问题导致都没法正常使用。微信版本升级后,会遇到各种报错, 以及无法获取到wxss分包无法反编译的问题。于是寻找资料,也买过别人的破解工具,最终解决文件缺失和...
  • 微信小程序反编译(mumu模拟器)

    万次阅读 2019-10-26 18:31:43
    主要步骤 一、下载网易模拟器 二、再模拟器上面安装对应...四、打开RE文件管理器,进入到目录中:/data/data/com.tencent.mm/MicroMsg,找到小程序,发送到微信 详细过程: https://juejin.im/post/5ccfffb6518825...
  • 微信小程序反编译获取前端代码

    千次阅读 2020-09-27 09:34:14
    直接开始、整体操作步骤为:安装反编译相关工具》在模拟器中访问需要反编译微信小程序》通过Re文件管理器定位并获取到微信小程序的.wxapkg包文件》应用反编译工具解析文件获取小程序前端代码。 具体操作步骤如下:...
  • 微信小程序 反编译

    2018-11-22 11:53:00
    反编译处于技术学习角度,瞻仰大神代码。 使用工具 node mumu安卓模拟器 获取小程序文件 小程序的代码压缩之后 会形成一个后缀为 wxapkg 的文件,下载到微信客户端 打开mumu模拟器,安装微信登录之后,...
  • 适用于反编译2021年后开发的小程序
  • 想认真一步步来研究请看这里,https://blog.csdn.net/chengzailushang/article/details/113364653对于有时间经历的人...最后咱们反编译的结果是 微信小程序的源码包微信小程序的源码包微信小程序的源码包 重要的话说...

空空如也

空空如也

1 2 3 4 5 ... 18
收藏数 358
精华内容 143
关键字:

微信小程序反编译wxss

微信小程序 订阅