webpack逆向实战

webpack逆向实战：登录参数加密分析
已于 2024-10-14 22:10:47 修改
阅读量1.6k 收藏 17
点赞数 25
CC 4.0 BY-SA版权
文章标签： webpack 前端 node.js
于 2024-10-14 22:10:35 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_62819126/article/details/142928844

webpack的作用

  • 模块打包：Webpack能够识别并处理各种类型的模块（如JavaScript、CSS、图片等），并通过依赖关系图来确定它们之间的引用关系。

  • 代码转换：Webpack支持使用各种加载器（Loaders）对不同类型的文件进行转换。例如，可以使用Babel加载器将ES6+的JavaScript代码转换为浏览器可识别的ES5代码。

  • 代码分割：Webpack可以将应用程序拆分为多个块（chunks），并在运行时动态加载它们。这有助于实现按需加载，提高应用程序的性能。

  • 文件优化
  • 开发者工具

webpack网站逆向

网址：aHR0cHM6Ly9zeW5jb25odWIuY29zY29zaGlwcGluZy5jb20v

目标：登录参数password逆向（账号，密码格式无限制）

接口地址：aHR0cHM6Ly9zeW5jb25odWIuY29zY29zaGlwcGluZy5jb20vYXBpL2F1dGgvc2NoL2F1dGhvcml6YXRpb24vY2xpZW50L2xvZ2lu

定位参数方式：全局搜索"password:",断点调试。

分析：

  1. t变量是我们输入的密码值，通过g.b方法对其进行加密，目标是逆向g,b方法。
  2. 观察到g对象由上面的n("MuMz")生成，可能是webpack的模块导入，若是webpack那么分析出webpack的加载器，即可引用相应模块完成加密

观察到该文件开头是webpack加载器形式

最低0.47元/天 解锁文章
SHiHy^^
关注
webpack实战：某网站RSA登录加密逆向分析
吴秋霖的博客
09-12 8927
某网站登录RSA加密，深度分析webpack代码并构建完整的加密webpack代码！
js逆向——webpack扣法
sin_0119的博客
03-19 5996
是个静态模块打包工具，目的是为了让前端工程师写的前端代码变成浏览器可以识别的代码，并且可以达到前端项目的模块化，也就是如何更高效地管理和维护项目中的每一个资源。这是因为加载器函数实际上是在你打开网页的时候就已经加载到内存中了，而只有当我们进行登录这一具体操作时才会执行调用这个函数，所以这时是找不到加载器的。直接把大对象给传进去了，而是在另一个独立的文件里面，那么加载器又是如何对另一份独立的文件中的模块进行加载的呢?但是，当断到我们想要的目标函数时再去定位n(“”)函数哪里是显示不出来的，如图。
JS逆向实战19——通杀webpack逆向
有什么问题回复不及时，可以私聊我。也可以加我的星球：知识爬行者
06-30 4350
声明 本文章中所有内容仅供学习交流，抓包内容、敏感网址、数据接口均已做脱敏处理，严禁用于商业用途和非法用途，否则由此产生的一切后果均与作者无关，若有侵权，请联系我立即删除！ 网站 aHR0cHM6Ly9mb2dhbmctbS5pdG91Y2h0di5jbi9tZWRpYURldGFpbC8zODc1Nw== aHR0cHM6Ly93d3cuZ205OS5jb20v webpack是什么？...
逆向使用webpack打包的网站
joker_zsl的博客
01-17 1338
webpack 是 JavaScript 应用程序的模块打包器,可以把开发中的所有资源（图片、js文件、css文件等）都看成模块，通过loader（加载器）和 plugins （插件）对资源进行处理，打包成符合生产环境部署的前端资源。所有的资源都是通过 JavaScript 渲染出来的。最基础最简单的样式：一个自执行方法，方法内部是加载器，入参是要加载的模块；加载器中明显的内容是类似 e[t].call(a.exports, a, a.exports, n)；入参一般是数组或对象，里面是各种函数。
JavaScript逆向webpack
SamsongSSS的博客
09-01 2021
webpack是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)，负责分析翻译压缩打包代码。我们js逆向过程中会经常遇到，这里借助七麦数据的例子，介绍下webpack逆向的通用方法。
JS逆向之Webpack(一)
Wxc的Blog
03-09 6626
JS逆向之Webpack 今天我们来学习一下js逆向之扣webpack代码 网址如下 https://www.gm99.com/ 需要逆向的值： 登录请求的password 首先肯定不是md5或者sha1或者des这类的，看上去想rsa，因为可以看到输入相同的密码加密后的结果不一样，好了那我们就开始吧 找到加密点 这是一个xhr请求，那我们直接看方法栈，很容易定位到时在n.login这里做了手脚，点进去看看 然后已经可以发现加密的地方了 然后我们下个断点，再提交一次看看 可以看到是对raw pass
逆向案例十六——简单webpack逆向，财联社信息
m0_57265868的博客
04-09 1299
最后解决方法见链接：【搞Python爬虫JS逆向，再不会WebPack解密，就OUT啦！可以发现这个文件是一个多文件的webpack，最上面的代码展现。现在的目标就是复制 W2Yj函数，直接在sign所在的js文件搜索并复制粘贴。发现W2Yj还调用了其他模块，为了找到它们，直接在控制台打印。其中n为加载器，里面的字符串为webpack后面列表中的字典的键，对应的配置函数。鼠标放在m上，进入m，发现是一个最后列表函数为空的webpack。这种形式，是一个加载器，在同js文件上面找S生成的位置。
【逆向篇】Web逆向WebPack结构分析
MAI44的博客
12-23 3723
用需要找到这个加密代码段给扣下来，进行加密，方便我们写的爬虫或者采集工具去自动登录或者其他操作，一般前端加密代码一个难点是处理webPack打包结构的代码。webpack字如其名，实际上是网页代码的一种打包机制将多个js文件（也可以是其他类型文件，比如.png）统一打包为一个js文件，一个png文件当然如果是webpack多打包机制就会生成多个js文件最终目的肯定是为了压缩代码，提高代码执行效率。好几万行代码，如果是高手能直接复制要用到的代码就当我是p话。ok.这样我们就得到了webpack加载器的代码！
Webpack逆向（附案例）
m0_55337562的博客
07-01 2050
本文介绍了JavaScript中匿名函数与Webpack模块系统的核心原理。主要内容包括：1）匿名函数与IIFE模式在Webpack中的应用；2）Webpack模块加载器的实现机制，通过数组/对象结构和闭包管理模块；3）逆向分析Webpack代码的技巧，包括全局对象注入、日志输出和注释初始化；4）以某医疗平台为例，展示了如何通过Hook方法定位加密函数并提取Webpack模块。文章揭示了Webpack利用匿名函数实现模块隔离的核心思想，为逆向工程提供了实用方法。
js逆向——webpack实战案例(一)
Tandy12356_的博客
09-28 1864
首先通过跟栈的方法找到加密位置我们跟进u函数，发现是通过webpack加载的向上寻找u的加载位置，然后打上断点，刷新网页，让程序断在加载函数的位置u = r.n(a)
js 逆向实战之webpack 改写
01-12
"JS 逆向实战之 Webpack 改写" 在本节中，我们将探讨 JS 逆向实战之 Webpack 改写的技术要点。Webpack 是一个流行的 JavaScript 模块加载器和打包工具，广泛应用于前端开发中。通过对 Webpack 的逆向工程和改写，...
JS逆向之Webpack打包方式（实战案例）
热门推荐
m0_64408930的博客
04-09 2万+
本文讲webpack打包方式，可以对代码进行分割，按需加载模块，提高爬虫性能。
爬虫：JS逆向之Webpack-乾坤大挪移
gwb0516的专栏
11-21 3697
通俗易懂webpack逆向的教程，方便初学者可以对照着一步一步验证调试。
webpack原理和逆向实战
鬼手的博客
01-13 5920
webpack是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)，负责分析翻译压缩打包代码。上面的官网的一张示例图。找到加载器，在调用模块的地方下断点，刷新网页构造自执行函数找到调用的模块编写调用函数。
JS逆向---webpack专题讲解
m0_52336378的博客
08-04 3185
webpack是一个现代的前端打包工具，它的主要作用是将多个模块打包成一个或多个静态资源文件。通过配置webpack，我们可以定义入口文件和出口文件，使用插件和加载器来处理不同类型的文件，以及设置开发模式和使用webpack开发服务器。[1][2]使用webpack可以实现模块化开发，提高前端项目的开发效率和性能。对于webpack的配置项，我们需要了解入口和出口的设置，插件和加载器的使用，以及开发模式和webpack开发服务器的运作过程。声明。
【JS逆向】之webpack逆向实战
weixin_44504978的博客
02-22 6262
声明：本文只作学习研究，禁止用于非法用途，否则后果自负，如有侵权，请告知删除，谢谢！ 目标网站： aHR0cHM6Ly8xNTE0NjQ2LmNvbS9sb2dpbg== 引言 webpack对于有研究过人的来说就是，难度并不是很高，但是因为webpack的代码，非常的繁多，一个webpack可能就是几万行代码。运行速度自然也会受到影响，如果是普通不管运行时长的代码来说，可能无关紧要，但对于一些抢购lei软件来说，一毫秒都相当的重要。所以减少无关的代码，压缩代码时很重要的，我前面写的自吐算法就可以达到压缩和
js逆向 freightsmart航运--webpack逆向
专注于php高级知识分享
03-06 1330
声明 本文章中所有内容仅供学习交流，严禁用于商业用途和非法用途，否则由此产生的一切后果均与作者无关，若有侵权，请联系我立即删除！ freightsmart 登录 webpack 逆向，下面是逆向流程 网页地址：aHR0cHM6Ly9mcmVpZ2h0c21hcnQub29jbC5jb20v 1.进入网页点击右上角登录按钮，触发登录查看登录接口，如果没有账户可以注册一个。 2. 查看post 发送的参数，发现有3个参数，第一个是username 账号名称，password为登录密码，第三个参数为空，先不管，
【前端安全】逆向webpack加密算法
qinjilll的博客
10-09 2743
webpack一个静态模块打包器，有入口、出口、loader和插件，通过loader加载器对js、css、图片文件等资源进行加载渲染。
逆向案例二十二——同样是webpack
m0_57265868的博客
04-13 696
发现r就是code,r由o()(n + "9527" + n.substr(0, 6))生成， n在方有赋值，是时间戳n = Date.now().toString()现在r=n(2568)处打上断点，释放其他断点，然后刷新页面，这里只能刷新页面，点击下一页没用。哇塞，一看就是webpack，现在要找加载器，然后再找模块，其实本文件就是webpack的子文件，可以直接全部复制，但是我们一个一个来。看到异步栈，怎么处理，进入异步栈，打上断点呗，点击下一页。跟栈，在起始栈打上断点，点击下一页。
js逆向进阶webpack
最新发布
09-21
<think> 首先，用户的问题是：“我想获取JavaScript逆向在Webpack方面的进阶知识 请问JavaScript逆向进阶之Webpack相关知识”。这表明用户想了解Webpack在JavaScript逆向工程中的进阶知识。 回顾用户的引用： - 引用[1]: 提到Python逆向工程和为什么学习前端的webpack，暗示Webpack在逆向中的重要性。 - 引用[2]: 解释Webpack是一个静态模块打包工具，用于前端开发。 - 引用[3]: 描述一个案例网站使用Webpack打包和混淆，需要调试技巧和Hook技术。 - 引用[4]: 详细谈论Hook、AST反混淆、补环境框架，特别是Webpack模块化原理和结构分析。 - 引用[5]: 提到简单代码的函数结构，对比Webpack打包。 这些引用集中在Webpack打包、混淆、逆向技术如Hook、AST反混淆等。用户要求进阶知识，所以我需要提供比基础更深入的信息。 系统指令： - 回答必须使用中文。 - 行内数学表达式用$...$，但这里可能不涉及数学表达式，除非涉及到算法等。 - 独立公式用$$...$$并单独成段。 - 生成相关问题。 - 在引用末尾添加引用标识，如[^1]。 回答结构： - 结构清晰，逐步解决问题。 - 确保回答真实可靠。 核心内容：JavaScript逆向进阶之Webpack相关知识。 基于引用[4]，重点包括： - Webpack模块化原理：Webpack如何加载模块，特征如模块ID、加载器等。 - 逆向技巧：使用AST反混淆、Hook技术、补环境框架。 - 具体示例：如引用[4]中的AST反混淆代码片段。 组织回答： 1. **引入Webpack在逆向中的重要性**：基于引用[1]和[3]，解释为什么在JavaScript逆向中需要了解Webpack。 2. **解释Webpack基础**：简要回顾Webpack是什么（引用[2]），但重点在进阶。 3. **进阶逆向技术**： - **模块加载特征**：Webpack如何加载模块，识别模块结构（引用[4]）。 - **Hook技术**：如何Hook Webpack加载器来拦截模块（引用[3]和[4]）。 - **AST反混淆**：使用抽象语法树反混淆Webpack打包的代码。引用[4]提供了代码示例，我可以描述或简化它。 - **补环境框架**：如何模拟Webpack环境来运行代码（引用[4]）。 4. **案例分析或步骤**：提供一个简化的步骤指南。 5. **相关问题**：在末尾生成几个相关问题。 确保引用标识： - 在相关内容末尾添加[^n]，对应引用号。 例如，讨论Webpack模块化原理时，添加[^4]。 生成相关问题： - 基于内容，如：如何识别Webpack打包的代码？Webpack逆向的常见挑战？如何优化AST反混淆过程？ 最终回答结构： - 标题或开头清晰。 - 分段：模块化原理、逆向技巧、工具使用等。 - 结尾相关问题。 </think> ### JavaScript逆向进阶之Webpack相关知识 在JavaScript逆向工程中，Webpack作为现代前端的主流打包工具，常被用于模块化处理和代码混淆，这使得逆向分析更具挑战性。进阶知识包括理解Webpack的模块化原理、应用Hook技术拦截模块加载、使用AST反混淆处理混淆代码、以及构建补环境框架来模拟运行环境。以下我将逐步解析这些核心内容，帮助您深入掌握Webpack逆向的进阶技巧。回答基于可靠资料和实际案例[^1][^2][^3][^4]，确保方法真实可行。 #### 1. **Webpack模块化原理与结构特征** Webpack通过模块加载器将多个文件（如JavaScript、CSS）打包成优化的静态资源，其核心是模块依赖图。在逆向中，识别Webpack打包代码的特征是关键： - **模块加载特征**：Webpack使用数字ID或哈希值标识模块，例如`__webpack_require__(moduleId)`函数加载依赖。模块通常存储在数组或对象中，如`[function(){...}, function(){...}]`。逆向时需定位入口模块（通常是index 0）和分析依赖链[^4]。 - **打包结构**：Webpack输出文件包含运行时逻辑（如`__webpack_require__`）和模块数组。通过调试工具（如Chrome DevTools）设置断点在`__webpack_require__`调用点，可以跟踪模块执行路径[^3][^4]。 这一原理是逆向基础，理解后能快速识别Webpack打包代码与非打包代码（如简单函数式结构）的区别[^5]。 #### 2. **Webpack逆向核心技巧** 进阶逆向依赖工具链和方法论，主要包括Hook技术、AST反混淆和补环境框架： - **Hook技术拦截模块加载**：Hook允许劫持关键函数调用，如覆盖`__webpack_require__`来实时获取模块内容。示例流程： - 使用浏览器控制台或工具（如Fiddler AutoResponder）注入Hook脚本。 - 例如，Hook模块加载器以打印模块ID和源码： ```javascript // 覆盖webpack的require函数 var originalRequire = __webpack_require__; __webpack_require__ = function(moduleId) { console.log("Loaded module ID:", moduleId, "Content:", modules[moduleId].toString()); return originalRequire.apply(this, arguments); }; ``` 这有助于动态分析加密或混淆逻辑，常用于处理API参数加密站点[^3][^4]。 - **AST反混淆处理混淆代码**：Webpack常结合混淆工具（如javascript-obfuscator），AST（抽象语法树）技术通过解析和修改代码结构还原可读性。步骤如下： - **解析代码生成AST**：使用工具如esprima或Babel解析JavaScript代码。 - **遍历和修改节点**：例如，还原字符串拼接或常量折叠。 - **生成新代码**：使用escodegen输出反混淆后的代码。 引用[^4]提供了AST反混淆的完整示例（简化版）： ```javascript // AST反混淆示例：还原字符串拼接 const deobfuscate = (code) => { const ast = esprima.parseModule(code, { range: true, tokens: true }); estreeWalker.walk(ast, { enter(node) { if (node.type === 'BinaryExpression' && node.operator === '+') { const left = node.left.value; const right = node.right.value; if (typeof left === 'string' && typeof right === 'string') { node.type = 'Literal'; node.value = left + right; delete node.operator; delete node.left; delete node.right; } } } }); return escodegen.generate(ast); }; // 测试混淆代码 const cleaned = deobfuscate(`console.log("Hello" + " World");`); console.log(cleaned); // 输出: console.log('Hello World'); ``` 此方法能有效处理Webpack打包后的复杂表达式，但需熟悉AST节点类型以应对高级混淆[^4]。 - **补环境框架模拟运行**：Webpack模块依赖浏览器环境，逆向时需构建补环境框架（如Node.js环境）来执行代码。关键点： - **Webpack模块特征分析**：识别加载器逻辑（例：`__webpack_modules__`数组）并模拟`window`或`document`对象。 - **框架实现**：使用工具如Puppeteer或自定义脚本注入缺失全局变量。示例：针对Webpack打包文件，创建一个模拟环境加载模块并导出函数。 ```javascript // 简易Webpack补环境框架 const vm = require('vm'); const fs = require('fs'); const webpackBundle = fs.readFileSync('bundle.js', 'utf-8'); const context = vm.createContext({ console: console, window: {}, // 模拟浏览器环境 document: {}, __webpack_require__: function(moduleId) { /* 自定义实现 */ } }); vm.runInContext(webpackBundle, context); // 调用目标模块 context.__webpack_require__(0); // 入口模块 ``` 这适用于离线分析加密逻辑，如逆向API参数生成[^4]。 #### 3. **实战建议和工具链** - **调试技巧**：优先使用Chrome DevTools的Source面板设置条件断点，并结合Network面板捕获Webpack加载过程。 - **工具推荐**： - AST处理：esprima（解析）、estraverse（遍历）、escodegen（生成）。 - Hook辅助：Frida（动态注入）、Tampermonkey（浏览器扩展）。 - 混淆分析：deobfuscation.io（在线工具）。 - **常见挑战**：Webpack逆向常遇到代码压缩和多重混淆，建议结合Hook和AST逐步还原。例如，先Hook入模块ID，再AST处理函数体[^3][^4]。 Webpack逆向进阶知识强调多技术协同：模块化为核心，Hook动态捕获，AST静态分析，补环境执行验证。这不仅适用于前端安全研究，还扩展至爬虫开发和数据采集[^1][^2]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值