js逆向——webpack扣取代码

一、webpack简介

webpack字如其名，实际上是网页代码的一种打包机制

将多个js文件（也可以是其他类型文件，比如.png）统一打包为一个js文件，一个png文件

当然如果是webpack多打包机制就会生成多个js文件

最终目的肯定是为了压缩代码，提高代码执行效率

1、当前网页前端主流的打包框架

国内：vue

国外：react

其他：webpack

2、函数打包出现重名问题

webpack完全采用闭包机制（也就是通过作用域）的办法来避免需要压缩的几个文件内部的函数有重名的现象发生（一人一个作用域就可以避免函数重名的问题），也就是：

var jss = [ {对象1}，{对象2}，{对象3} ]

对象1也可以是函数形式：

{

getInfo：function(){

}

}

这样，想要调用不同文件的重名函数变为：

jss[0].func1()

jss[1].func1()

这样既解决了函数名重名问题（即允许重名），又可以调用你希望调用的函数了

但是现在还有一个新的问题就是有些私有方法我不希望被外部调用，也就是访问权限问题，这个就像C++里面的共有、私有函数一样

webpack的解决方案是可以被外部访问的共有方法一律需要导出才行，即：

export：function（）{

        var getInfo = function（）{

        具体代码;

        return {getInfo ：getInfo }

}

}

二、webpack函数的调用

1）通过数组的方式调用

2）通过对象的方式调用

//webpack加载器
!function(e) {
    var t = {};

    // 加载器  所有的模块都是从这个函数加载 执行
    function n(r) {
        if (t[r])
            return t[r].exports;
        var o = t[r] = {
            i: r,
            l: !1,
            exports: {}
        };
        return e[r].call(o.exports, o, o.exports, n),
            o.l = !0,
            o.exports
    }
}
    ([
        function () {
            console.log('123456')
        },

              function () {
            console.log('模块2')
        },
    ])
n(0)

!function(形参){}()是一种自执行函数，无需调用网页加载的时候自动执行

这里的e实际上就是[func1,func2,func3...]这个大数组

n(0) 就是调用数组的第一个函数，打印123456

如果是对象{}形式的话，就是n("7f6d")这种形式来调用

三、天翼云webpack案例

受害者网站：https://m.ctyun.cn/wap/main/auth/login

首先通过跟栈法追踪到password加密的关键位置

这里的Object实际上是一种混淆，可以直接去掉

也就是encodeURI(Object(b["c"])(i.value, Object(b["f"])(Object(b["g"])(r.value))))等价于：

encodeURI(b["c"]("123456789",b["f"]("123456@qq.com")))

向上找到b的生成位置

类似o("7f6d")这种形式高度怀疑是webpack打包的

如果不确定的话把该文件翻到最上面，发现还是一个webpack多打包的形式

 

下一步刷新网页，控制台输入o，跟进其内部

这样我们就得到了webpack加载器的代码！！！

将webpack的主文件全部复制下来到notepad++当中

输入webpackJsonp得到所有的子文件

将webpack所有子文件复制下来，依次放到主文件的下面

全部扣下来一共3万多行

将加载器导出到全局以便调用

在代码片段的最后加入如下代码进行测试

o=window.bubu; 

b = o("7f6d") ;

encodeURI(b["c"]("123456789",b["f"]("123456@qq.com")));

在运行过程中看到结果了，但是一闪而过，说明重定向了

我们需要进入主模块，删除初始化部分的代码

这样我们就在浏览器环境下通过全扣法拿到了正确结果

下一步在fd当中无环境运行正确结果

删减的原则：

1）对于if...else需要观看进入哪个语句来给变量赋值

2）对于三目运算符等逻辑判断可以在网页打debugger然后删除代码

3）对于xxx undefined直接赋值为""

经过删删改改在fd无环境也能正常运行了

由于在调用o("7f6d")的过程当中并不是用到webpack的所有模块，所以我们可以简化代码来提高程序执行的性能

通过观察导出函数的格式

我们可以添加window.code+="\""+n+"\""+":"+e[n]+","

来获取所有o函数加载的模块

记住是在fd当中进行打印，如果想进一步保险简化，可以加一个判断条件pd=0等执行o("7f6d")的时候将判断条件修改为1，这样可以去掉一部分初始化的代码。

使用简化后的代码放到e这个大对象里面，再次执行，也得到正确结果了

而简化后代码行数减少为1万行

最后再总结一下webpack扣取的步骤

1）通过进入webpack的加载器拿到完整的主文件

2）通过webpackJsonXXX的方式获取拿到所有子文件，按次序放到主文件的下方

3）导出加载器到全局，如果有初始化的代码就删除掉

4）现在浏览器环境模拟运行加密算法

5）在fd无环境下模拟运行加密算法

6）有条件的话在fd环境修改加载器代码window.code+="\""+n+"\""+":"+e[n]+",“，拿到使用到的所有模块，覆盖掉之前加载的代码

7）在fd当中成功运行简化后的代码

ok，今天的你就到此为止吧，明天还要接着🐺啊