Webpack前端源码泄露漏洞
什么是Webpack？
webpack是一个打包器（bundler），它能将多个js、css、json等文件打包成一个文件。这样可以使复杂的各种加载文件集合为整合为单一的集合，让代码更加模块化便于编程使用和浏览器加载。
Webpack使用不当能造成什么样的危害？
如果可以获得程序的js代码，那么就可以针对源代码对代码中各种信息如隐蔽接口、API、加密算法、管理员邮箱、内部功能等等，或者接口API可以尝试未授权漏洞，拼接接口越权漏洞，查找源代码中关键字去GitHub查找程序源码进行代码审计。
如何查找使用Webpack的站点？
存在*.js.map文件
webpack目前支持很多种调试模式，每种模式的区别是编译后的代码和源码的映射方式不同，具体的体现是源码通过什么方式呈现，有的模式会生产一个.map文件，有的模式会通过注释，有的模式会使用DataUrl的方式。
| 模式 | 类型 |
|---|---|
| (none) | 不生成 |
| eval | 每个module会封装到eval里包裹起来执行，并且会在末尾追加注释 //# sourceURL=webpack:///./src/index.js |
| source-map | 生成一个SourceMap文件.并在末尾添加注释 |
| hidden-source-map | 和 source-map 一样，但不会在 bundle 末尾追加注释 |
| inline-source-map | 生成一个DataUrl形式的 SourceMap 文件 |
| eval-source-map | 每个module会通过eval()来执行，并且生成一个DataUrl形式的SourceMap |
| cheap-source-map | 生成一个没有列信息（column-mappings）的SourceMaps文件，不包含loader的sourcemap（譬如 babel 的 sourcemap） |
| cheap-module-source-map | 生成一个没有列信息（column-mappings）的SourceMaps文件，同时loader的sourcemap也被简化为只包含对应行的。 |
shuji工具还原前端代码
使用nmp安装
npm install --global shuji
使用命令
shuji app.js.map -o desfile
还原前文件
还原后文件
这样就可以愉快的分析一波js了。
浏览器调试模式
使用浏览器的调试模式进行查看，可以看到下图泄露了部分的接口，可以尝试对接口进行拼接FUZZ，有时候可以找到意想不到的漏洞。 需要注意的是，有些前端应用即使是通过Webpack打包的，但由于关闭了SourceMap，无法正常显示。
URL中带有#符号
这个如下图所示。
查看源代码&检索全部js文件
由于Webpack打包工具所生成的网站大部分会简化掉大量的HTML代码，采用js文件进行页面渲染，前端的所有内容都依赖于浏览器对JS文件的解析，所以查看首页源代码如果看到全是js文件，即可判断改站使用Webpack打包生成，如下图所示。
检索全部js文件，查找是否存在关键字.，Webpack所生成的每个js文件具体内容均以webpackJsonp开头。
SourceMap
webpackJsonp
wappalyzer查看
如下图所示
最新文章
- android 两种实现计时器时分秒的实现，把时间放在你的手中~
- JAVA自定义异常
- Html做三个平台原生APP啦
- SQL 按特定字段值排序
- jQuery：常用方法一览
- 调整win7 Windows7下时间同步的频率时 钟同步间隔
- [BZOJ 1055][HAOI2008]玩具取名（DP）
- easyrtc-server在ubuntu14.04上的安装方法
- SharePoint 2010 最佳实践学习总结------第1章 SharePoint Foundation开发基础
- lintcode:递归打印数字
- uCGUI窗口操作要点
- 分享非常有用的Java程序(关键代码)(八)---Java InputStream读取网络响应Response数据的方法!(重要)
- JAVA字符串格式化-String.format()使用
- Adaptive Server Enterprise ODBC driver connection strings
- JS浏览器对象：window对象、History、Location对象、Screen对象
- python_语法糖_装饰器
- git分支操作2
- OffsetDateTime工具类
- 最新版本Bootstrap样式很奇怪(4.1版本)
- html5备忘录——张鑫旭