【作者主页】：小鱼神1024
【擅长领域】：JS逆向、小程序逆向、AST还原、验证码突防、Python开发、浏览器插件开发、React前端开发、NestJS后端开发等等
本文章中所有内容仅供学习交流使用，不用于其他任何目的，不提供完整代码，抓包内容、敏感网址、数据接口等均已做脱敏处理，严禁用于商业用途和非法用途，否则由此产生的一切后果均与作者无关！若有侵权，请联系作者立即删除！
【该文章已同步至星球】：https://articles.zsxq.com/id_txwb0un7w7vw.html
前言
在 JS 逆向分析中，我们经常会遇到使用 webapck 打包的网站，那以下问题你是否遇到过呢？
当然了。网上讲理论知识讲解的已经非常全面了，这里就不一一赘述了，这里主要讲解实战，即使是新手也能快速上手。
webpack__21">webpack 加载器分析
在 webpack 中，我们经常会看到以下代码：
!(function (e) {// 对象缓存var c = {};function n(t) {// 如果对象缓存中存在，则直接返回if (c[t]) return c[t].exports;var a = (c[t] = {i: t,l: !1,exports: {},});return e[t].call(a.exports, a, a.exports, n), (a.l = !0), a.exports;}
})(模块);
它实现逻辑很简单，就是一个函数调用。模块 是参数，它可以是对象，也可以是数组。无非就是把普通函数改成了自执行函数。
x-xray-traceid 分析
为了学习 webpack 加载器，我们以某书为例，分析一下 x-xray-traceid 签名算法。
通过简单搜索，找到 x-xray-traceid 生成位置，这个应该不难吧。如下：
翻到最上面，发现 webpack 的 关键字眼，如下：
然后把这个文件的所有 模块 扣下来，放到框架的 modules.js 文件中，如图：
然后在控制台执行 npm run dev 或者 pnpm dev 后，报错提示如下：
提示 缺少模块: 87989，那么全局搜索 87989:，如图：
同理，将这个文件所有的 模块 扣下来，放到 modules.js 文件中，根据提示，补全所需的 模块 之后，再执行命令：
可以看到，总共加载了 92 个模块，如果是人工扣取，那工作量是非常大的，而且容易出错，所以使用 webpack 自动扣代码是非常有必要的。
框架会自动将所涉及到的 模块 和 加载器 都自动写入到 out.js 文件中，如图：
运行 out.js 文件，可以看到 x-xray-traceid 签名参数已经生成了。 如图：
可以看到，如此大的工作量，即使是新手的情况下，只需要导入 模块 到 modules.js 文件中，然后执行命令即可，几分钟就搞定了。
【webapck框架下载】：https://wx.zsxq.com/group/48888154214548/topic/5121821811848814
【x-xray-traceid参数生成js】：https://wx.zsxq.com/group/48888154214548/topic/1525825854282842
以上代码仅供学习交流使用，请勿用于其他任何目的！
