JS逆向：破解 webpack 打包站点及 JS 代码扣取实战

webpack 打包特征识别

webpack 是现代前端开发常用的打包工具，它将多个 JavaScript 文件合并压缩。这种打包方式会产生非常明显的代码结构特征，掌握这些特征是进行逆向分析的第一步。

首先，观察网络请求加载的资源文件名。如果看到类似 app.版本号.js 或 chunk-libs.版本号.js 这样的资源名称，且文件大小较大，通常暗示该站点使用了 webpack 等模块化打包方案。

注意：以下提到的参考站点仅为技术演示案例。在实际业务中，请遵守目标网站的 robots.txt 协议及相关法律法规，仅用于学习研究。

其次，查看源码内部结构。经过 webpack 打包后的代码通常会包含一段特定的初始化逻辑，例如全局变量赋值或立即执行函数。典型的代码片段如下：

(window.webpackJsonp = window.webpackJsonp || []).push([[0], []]);

当你在调试过程中发现这类特征时，基本可以确定这是基于 webpack 实现的加密站点。

定位核心加密函数

以登录接口为例，我们需要找到生成签名或加密参数的具体位置。通过在浏览器开发者工具的 Sources 面板中设置断点，可以逐步深入分析。

第1步：设置请求断点

在 Network（网络）面板中过滤相关请求（如包含关键字 login/login3），重新触发请求后，点击 XHR 断点或直接搜索关键词。此时调试器会暂停在某段 JS 代码处。

第2步：追踪加密调用栈

观察堆栈信息，向上追溯调用链。通常可以看到一个名为 a.encode() 或类似的自定义函数被调用。点击进入该函数内部，你会看到大量混淆、难以阅读的 webpack 打包痕迹。

在这些代码中，重点寻找以下关键标识符，它们通常是 webpack 模块系统的核心组成部分：

• n = function(t,e,n)
• n.exports = s
• .call(e,i,e,t)

第3步：还原执行上下文

翻到被分析的 JS 文件头部，通常能找到一个包裹所有模块的全局执行函数。简化后的核心结构大致如下：

!(function (t) {
  function e(s) {
    return t[s].call(n.exports, n, n.exports, e), (n.loaded = !0), n.exports;
  }
  // ...省略部分逻辑...
})();

理解其执行规则至关重要：webpack 实际上是将每个模块放入一个大对象 t 中，通过入口函数 e(s) 来按需加载并执行指定编号（s）的模块。

!(function (t) {
  function e(s) {
    return t[s].call(n.exports, n, n.exports, e), (n.loaded = !0), n.exports;
  }
  e(0); // 启动执行模块索引为0的代码
  e(1); // 启动执行模块索引为1的代码（可能包含jQuery等依赖）
})({
  0: function (t, e, i) {
    // 这里是核心的加密逻辑或其他业务代码
  },
  1: function (t, e) {
    t.exports = jQuery;
  },
});

剥离与重构 JS 代码

既然理解了 webpack 的机制，我们就可以剥离出纯功能的加密代码，在 Python 或其他环境中独立运行，无需模拟完整的浏览器环境。

第4步：创建本地运行环境

新建一个 JS 文件（例如 local_env.js），编写最小化的 webpack 壳代码，目的是暴露核心函数供外部调用。我们将内部函数 e 挂载到全局变量 _e 上，以便后续访问。

var _e;
!(function (t) {
  var i = {};
  function e(s) {
    if (i[s]) return i[s].exports;
    var n = (i[s] = {
      exports: {},
      id: s,
      loaded: !1,
    });
    return t[s].call(n.exports, n, n.exports, e), (n.loaded = !0), n.exports;
  }
  _e = e;
})();

第5步：分区域提取代码

回到原网页的 JS 文件，根据模块 ID（即上面代码大括号内的数字键值对）进行切割。通常可以直接依据 function() 的定义边界进行复制。

将剥离出的各个模块代码依次粘贴到 local_env.js 的大括号内，替换掉原来的空壳模块定义：

// local_env.js 补充内容示例
_e({
  0: function(t, e, i) {
    // 此处填入原网页中ID为0的模块完整代码
  },
  1: function(t, e) {
    // 若有依赖库，也需填入相应代码，或者引入本地库
  }
});

第6步：验证执行结果

保存文件后，在当前文件夹下打开浏览器或 Node.js 环境运行该文件。如果配置正确，你将能够直接调用之前定位到的加密函数（如通过 _e() 触发内部逻辑），获取与网页端一致的加密输出结果。

以上就是破解 webpack 打包站点及代码扣取的详细内容。掌握这一流程不仅能应对常见的 JS 加密接口，也为后续更复杂的 Agent 开发或自动化脚本编写打下基础。更多关于前端逆向与爬虫技术的资料请关注本站其它相关文章！