前言

    昨天群友发了一个网址，表示学习时遇到了一个webpack打包的网站，不会扣代码。我也是抱着互相帮助（kan kan re nao）的态度看了一下，搞了搞。小网站不是自写算法的，一般遇到了都是直接调加密库了，很少会去扣代码，然而真正有需求去扣的时候也是会出现一些小问题。刚好有机会，顺便记录下。

    地址：aHR0cHM6Ly9zaGFyZS53Y3N6LnRvcC9hY3Rpdml0eS9pbnZpdGUtbmV3LXVzZXJzL3NoYXJlLyU3QiUyMmlkJTIyJTNBNTAwOTM2MSUyQyUyMm5pY2tuYW1lJTIyJTNBJTIyenp5JTIyJTdEP3Byb21vdGVDb2RlPXdmb28mZnJvbT1zaW5nbGVtZXNzYWdl

    先说结论，这个网站是标准的哈希算法 SHA1 和 SHA256，整个过程纯粹是为了练习扣webpack代码。只想看结果的小伙伴们到这里就可以了~~

分析

    老规矩 先抓包

    sign就是我们要找的了。添加XHR断点，再次发包：

    往下跟，发现到第一步的时候sign已经有值。那么接下来就要去异步里面找：

    最后找到这里，高度可疑：

    在这里下断，重新填写手机号发包，断下来了：

    sign，也就是a，是通过调用这个Object(E.a)(d.mobile, "86")得来的。两个参数是输入的手机号和86。F11跟进去：

    这个变量n肯定内有蹊跷。看看u是什么：

    静态分析一下，首先是e，取随机字符串呗

    然后t，执行p函数，将得到的值做运算。查看p函数，发现就是在取时间戳：

    那n也就出来了，把时间戳转成字符串。r是把e和n拼接后进行sha256加密。再后面的也就是几个简单的参数处理，最后进行md5，把结果返回。

    再往下跟的话你会发现把e和u返回之后又进行加盐，最后一步使用sha1加密，结果就是sign。这里我就不浪费篇幅了，跟这个函数毫无难度，没什么可说的。

    我们看看这个sha256吧：

    进去以后他长这样：

    找到函数的开头，乱七八糟的webpack引入：

    那么这个函数怎么扣出来为我们所用就是这次要说的了。前面文章提到过，webpack打包一般会修改内置的push方法，然后把所有打包的函数都放在一个数组里，通过向入口函数传入要调用的函数序号获得调用对象。大概意思就是我把所有函数收集起来封装在底层里，然后暴露给你一个接口，你想要调什么，都通过我给你的这个接口来调用。你可以选择硬扣，也可以选择通过我这个接口。简单的单个的函数可以选择前一种方式，但是如果是自写算法，模块之间调用比较多，那么你选择硬扣，肯定会掉不少头发。这时我们就可以尝试恢复webpack的调用逻辑。    

    我们首先要找到webpack的入口，代码不会很多，必定是一个自执行函数。他会初始化收集函数的大数组，会有apply、call、push这类的关键词。有时候会在声明函数的js文件的最上方，有时会被提出来单独放在一个js里，有时候也直接在网页代码里直接调用。我们先找一下sha256所在的文件前面有没有：

    并没有，那就去网页源代码里看看JS导入顺序。然后在源代码里，我们发现他这几行代码很像：

    满足前面的几个特征，那么应该就是他了。我们先尝试找到入口函数，最大特征是通过call调用真实的函数。看了一圈，发现很有可能是这个：

    下个断点，刷新网页断在这里，看看参数：

    传入的参数f是313。大胆的断言，一定可以在某处找到313这个函数的定义。313是序号，或者是key，通过序号在数组e中找到这个函数(e[313])，使用call传参，313对应的函数真实执行结果就在exports中，也是这个入口函数最后返回的结果，那么这里的e就是收集所有函数的大数组。可以观察上面的sha256，最终拿到的sha256对象是不是也在exports中：

    也就是，我们如果可以拿到这个入口函数n，就可以通过传入真实函数的key来调用函数了。

    具体他这个是怎么运行的，小伙伴可以在webpack的入口，第一行代码开始下断点，一步步跟着走一圈，就明白webpack到底是怎么引入、调用函数的了。

    那么开始整理一下要扣出来的部分，webpack的入口肯定要拿出来。网页源代码里的400多行代码，全部拿下来。

    然后我们需要在开头的地方定义一个句柄，用于接收入口函数n：

    在n初始化后，把n赋给my_module：

    这样在自执行结束后我们就可以通过my_module调用函数啦。接下来我们要去扣加密部分代码。如果互相调用比较多，那么还是把整个函数都复制下来，这里这个算法并没有调用太多其他函数，剪几万行的无关代码有点蠢，我就直接复制sha256所在的777函数了。要保留整个文件的头部和尾部，中间部分可以只选择拿出777这个函数。

    开头：

    结尾：

    中间部分，从这行开始，到代码块结束，一共300多行：

    调用一下：

     ok，运行吧。不出意外的话。。。

    是会报错的。那就要调试一下缺了什么，是不是有一些需要的函数我们没有剪出来。我选择的方法是新建一个html文件，把代码复制进去，浏览器打开调试。毕竟浏览器的调试要比vscode的调试强大多了。

    运行后发现在这一行报错：

    那就在这里下断，刷新。

    第一次到这里的f是777，我们调用时传入的参数。F8并没有报错，然后继续断在了这里。我们发现f变成了304，看来是要调用304这个函数啊。

    再按下F8，果然报错了，没有找到304这个函数：

    我们去原网页中把304找出来。找的方法比较简单，在入口函数n里下断点，刷新页面，断在这里的时候，到函数数组e里面去找。

控制台输出一下，点击函数就过去了，就是这段：

    还挺长的，100多行。改写成这种形式：

    然后重复以上过程，我们把728、136也补了进来，这时应该是可以执行的。

    同样的代码在node里也是可以执行的。后面还有一个sha1，要比sha256简单，留给小伙伴们尝试了。

总结

    webpack毕竟不是为了反爬设计的，虽然有时会给工作带来一些困难，不过好在他变动性不大，掌握运行流程就没问题了。其他的复杂调用也可以用这个方法改，懒得扒就直接把所有js复制进来也没问题。还是建议不熟悉的小伙伴们在webpack的入口开始下断，跟着他调试一下，对理解webpack打包很有帮助。这个部分可能我也很难讲清楚，不过实践是最好的老师。

本文分析过程仅供学习交流，并无任何个人以及商业或其他用途。如有不慎侵权，请联系我删除。