记录一次发现Webpack源码泄露（js.map泄露）过程

最新推荐文章于 2025-02-25 22:18:23 发布

白马流星丶

最新推荐文章于 2025-02-25 22:18:23 发布

阅读量1w

点赞数 11

文章标签： webpack javascript 前端网络安全

本文链接：https://blog.csdn.net/qq_41760817/article/details/134977775

版权

Webpack源码泄露复现

一、漏洞简介
二、环境配置
- 1、安装nodejs
- 2、安装reverse-sourcemap
三、源码发现
四、反编译源码
五、修复建议

一、漏洞简介

Vue使用webpack(静态资源打包器)的时候，如果未进行正确配置，会产生一个js.map文件，而这个js.map可以通过工具来反编译还原Vue源代码，产生代码泄露。

二、环境配置

1、安装nodejs

使用npm -v查看版本

npm -v

在这里插入图片描述

2、安装reverse-sourcemap

使用如下命令安装

npm install --global reverse-sourcemap

在这里插入图片描述

三、源码发现

在目录扫描中，发现某个压缩包中存在js.map文件
在这里插入图片描述
解压该文件

四、反编译源码

reverse-sourcemap --output-dir . xxx.js.map

在这里插入图片描述
反编译成功，进入目录

五、修复建议

在项目路径下修改config/index.js中build对象productionSourceMap: false；
建议删除或禁止访问正式环境中的js.map文件；

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

白马流星丶

关注关注

11
点赞
踩
19

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

【网络安全】WebPack源码（前端源码）泄露 + jsmap文件还原

等风来

04-09

5930

webpack是一个JavaScript应用程序的静态资源打包器。它构建一个依赖关系图，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个bundle。大部分Vue等项目应用会使用webpack进行打包，使用webpack打包应用程序会在网站js同目录下生成 js.map文件。

Webpack Sourcemap文件泄露漏洞

天天学安全专属博客

09-12

3649

Webpack Sourcemap文件泄露漏洞

1 条评论您还未登录，请先登录后发表或查看评论

【渗透测试】Webpack源码泄露（js.map泄露）

网络安全从业者的学习笔记

07-10

4254

在Vue项目中使用Webpack时，如果未正确配置，会生成一个.map文件，它包含了原始JavaScript代码的映射信息。这个.map文件可以被工具用来还原Vue应用的源代码，从而可能导致敏感信息的泄露等风险

WEBPACK打包器的使用 && 打包器的安全问题（源码泄露） && 还原

热门推荐

LuckySec

12-03

2万+

webpack是一个JavaScript应用程序的静态资源打包器（module bundler）。它会递归构建一个依赖关系图（dependency graph）,其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个bundle。大部分Vue等项目应用会使用webpack进行打包，如果没有正确配置，就会导致项目源码泄露，可能泄露的各种信息如API、加密算法、管理员邮箱、内部功能等等。

Webpack源码泄露

总有人间一两风，填我十万八千梦

07-20

1万+

目录描述危害修复描述 webpack是一个JavaScript应用程序的静态资源打包器（module bundler）。它会递归构建一个依赖关系图（dependency graph）,其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个bundle。可以直接使用浏览器的调试模式进行查看，如下 vue应用，大部分会使用webpack进行打包，如果没有正确配置，就会导致vue源码泄露。什么是vue了？Vue.js（/vjuː/，或简称为Vue）是一个用于创建用...

前端js.map文件泄露

weixin_60965776的博客

11-20

3616

转换后的代码的每一个位置，所对应的转换前的位置。有了它，出错的时候，除错工具将直接显示原始代码，而不是转换后的代码,这无疑给开发者带来了很大方便。在日常测试时，经常会遇到以js.map为后缀的文件，非常多Webpack打包的站点都会存在js.map文件.，通过sourcemap可还原前端代码找到API,间接性获取未授权访问漏洞，什么是Source map。下载好js.map文件后就是逆向还原操作，我们用到的工具reverse-sourcemap。-o：还原后的目录，-v：需要还原的文件。

Webpack前端源码泄露漏洞

网安君的博客

03-16

2万+

什么是Webpack？ webpack是一个打包器（bundler），它能将多个js、css、json等文件打包成一个文件。这样可以使复杂的各种加载文件集合为整合为单一的集合，让代码更加模块化便于编程使用和浏览器加载。

Webpack源码泄露还原操作（js.map泄露）

qq_50854662的博客

08-26

2446

Webpack源码泄露还原操作（js.map泄露）

VUE 项目发布到服务器——Webpack源码泄露

sunzq55的博客

12-01

4253

背景正常通过 webpack 来打包 vue 项目,放到线上的项目是可以通过 F12 控制台的 source 来直接获取到前端项目源码，如图：修复建议：在 config/index.js 中 build 下的 productionSourceMap: true, 改为 productionSourceMap: false 实际解决办法在 vue-cli 中，关闭配置选项，如下图：在配置文件vue.config.js中修改配置项productionSourceMap，如下： module

渗透测试之webpack源码泄露

weixin_46072207的博客

07-24

1503

Vue使用webpack(静态资源打包器)的时候，如果未进行正确配置，会产生一个js.map文件，而这个js.map可以通过工具来反编译还原Vue源代码，产生代码泄露。

webpack代码泄露漏洞研究

weixin_44023460的博客

09-15

1837

Webpack的核心运行时代码位于node_modules/webpack/lib目录下，攻击者可以通过读取该目录下的代码来获取有关应用程序的敏感数据，例如加密密钥或访问令牌。攻击者可以读取配置文件获取这些敏感信息。Retire.js是用于检测JavaScript库和框架中存在的已知漏洞的工具，可以扫描Webpack打包的应用程序中使用的依赖库是否存在已知的漏洞。Dependency-check是用于检测应用程序中依赖库漏洞的工具，可以扫描Webpack打包的应用程序中使用的依赖库是否存在已知的漏洞。

Webpack源码泄露到Vue快速入门

记录开发和安全学习过程中的点点滴滴

05-23

3235

刚好最近学习了Vue和Webpack,回顾一下学习并对Vue的学习过程中对笔记总结进行记录,同时进行思考过程中的理解加入其中,方便自己进行后续的学习和回顾,当然因为这两个内容都和我之前在进行渗透测试中碰到的一种漏洞类型相关,其中很容易碰到资产是关于使用wepack进行打包的,并且存在js.map泄露,在源码泄露中,常见的前端是通过vue进行编写的,顺便加深一下之前渗透过程的印象.webpack是一个JavaScript应用程序的静态资源打包器。

【漏洞挖掘】——49、 Webpack源代码泄露

Fly_鹏程万里

06-07

592

基本介绍Webpack是一个开源的前端代码打包工具，它可以将多个JavaScript、CSS、图片等静态资源文件打包成一个或多个静态资源文件并通过模块化管理打包后的代码以提高前端应用程序的性能和加载速度，Webpack支持CommonJS、AMD、ES6等多种模块化规范并且提供了强大的插件机制和开发者工具，可以帮助开发者进行代码优化、压缩、混淆、实时重载等操作主要功能Webpack的主要功能包括：模块化规范：支持CommonJS、AMD、ES6等多种模块化规范。

webpack系列八---vue项目打包发布后源码泄露

hyduan_h5的博客

05-12

3518

在vue项目，打包后，默认会将源码打包上去，以至于用户可以在控制台查看到源代码，为了信息安全，也为了优化加载速度，需要配置相关属性；检查隐藏源码是否泄漏：打开控制台–查看sources/源代码tab–查看包文件，当有webpack文件时，这证明当前源码泄漏状态；当从控制台查看类似如下状态，则源码泄漏已解决；

xxxxx.js.map前端代码泄露

吃个榴莲压压鲸的博客

04-24

6966

背景目前前端部署的代码一般都是经过webpack压缩的，压缩的目的一般如下：移除无用代码混淆代码中变量名称、函数名称等对结构进行扁平化处理 Sourcemap作用 SourceMap在其中扮演了一个十分重要的角色，用来作为源代码和编译代码之间的映射，方便开发定位问题。一般在压缩 js 的过程中，会生成相应的 sourcemap 文件，并且在压缩的 js 文件末尾追加 sourcemap 文件的链接，如：//# sourceMappingURL=xxxx.js.map。这样，浏览器在加载

webpack信息泄露

qq_54030686的博客

10-04

1032

先看看webpack中文网给出的解释webpack 是一个模块打包器。它的主要目标是将 JavaScript 文件打包在一起,打包后的文件用于在浏览器中使用,但它也能够胜任转换、打包或包裹任何资源。如果未正确配置，会生成一个.map文件，它包含了原始JavaScript代码的映射信息。这个.map文件可以被工具用来还原Vue应用的源代码，从而可能导致敏感信息的泄露等风险那么就是说，存在webpack信息泄露问题的网站目录中，存在.map文件，该文件内包含了所有的js文件。

webpack源码泄露

08-21

webpack源码泄露是指在某些情况下，webpack项目的源代码可能会被泄露出去。当项目的源代码泄露时，攻击者可以获得包括API、加密算法、管理员邮箱和内部功能等敏感信息。在浏览器控制台中，可以通过访问Sources -> Page -> webpack://来查看webpack项目的源代码。然而，并不是所有情况下都可以直接在浏览器控制台中查看到webpack项目源码。如果无法直接在浏览器控制台中查看到源代码，但网站上存在js.map文件，我们可以通过一些工具如reverse-sourcemap来还原webpack项目的源码。这些工具可以解析js.map文件中的内容，从而恢复出webpack项目的源代码。为了避免webpack源码泄露，开发者应该正确配置webpack以确保源代码的安全性。同时，定期进行漏洞检测是非常重要的，以便及时发现和修复可能存在的漏洞。123 #### 引用[.reference_title] - *1* *2* *3* [webpack 源码泄露](https://blog.csdn.net/weixin_43571641/article/details/121689764)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]