Vue 源码泄露
0x01 漏洞简介
webpack是一个JavaScript应用程序的静态资源打包器(module bundler)。它会递归构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个bundle。大部分Vue应用会使用webpack进行打包,如果没有正确配置,就会导致Vue源码泄露,可能泄露的各种信息如API、加密算法、管理员邮箱、内部功能等等。
0x02 漏洞检测
Vue项目源码在泄漏的情况下,可以在浏览器控制台中的Sources—> Page—> webpack://中查看源代码
使用webpack打包Vue应用会在网站js同目录下生成 js.map文件
.map文件的作用:项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。 有了map就可以像未加密的代码一样,准确的输出是哪一行哪一列有错。
直接查看网站的js文件,可以在末尾处有js.map文件名
直接在当前访问的js后面拼接.map即可访问下载
通过以上两种方式可以判断目标网站存在Vue源码泄露问题
0x03 漏洞利用
在某些情况下,不能直接在浏览器控制台中的Sources—> Page—> webpack://中查看到Vue源码,但是网站上存在js.map文件,我们可以通过一些工具将js.map中的内容进行还原Vue源码
1. reverse-sourcemap
使用npm安装reverse-sourcemap
npm install --global reverse-sourcemap
检查是否安装
~/ reverse-sourcemap -h
reverse-sourcemap - Reverse engineering JavaScript and CSS sources from sourcemaps
Usage: reverse-sourcemap [options] <file|directory>
-h, --help Help and usage instructions
-V, --version Version number
-v, --verbose Verbose output, will print which file is currently being processed
-o, --output-dir String Output directory - default: .
-M, --match String Regular expression for matching and filtering files - default: \.map$
-r, --recursive Recursively search matching files
将js.map文件下载到本地,使用reverse-sourcemap进行js.map文件还原操作
reverse-sourcemap --output-dir ./ main-7692d0319da0ace0bfc4.js.map
执行成功后生成的源码会放在当前目录下的webpack中
接着就可以对Vue源码进行分析审计了
2. SourceDetector
SourceDetector是一个谷歌浏览器插件,此插件可以自动的判断网站是否存在js.map文件,并且能够利用该插件直接下载到js.map的Vue源码
下载插件项目到本地
git clone https://github.com/LuckyZmj/SourceDetector-dist
打开谷歌浏览器扩展程序的开发者模式,加载已解压的扩展程序,选中插件项目中的dist目录即可安装插件。
安装好插件以后,每次浏览网站时,该插件就会自动获取js.map文件
点击插件中的链接地址即可直接下载到js.map还原后的Vue源码
0x04 漏洞修复
- 在项目路径下修改config/index.js中build对象productionSourceMap: false;
- 建议删除或禁止访问正式环境中的js.map文件;
相关文章
- VUE响应式原理-Dep类「建议收藏」
- Vue(3)webstorm代码格式规范设置与vue模板配置
- vue elementui navmenu 多级导航菜单(水平、垂直)
- html使用vue axios,使用 Vue和axios
- VUE 数据分页
- 前端面试选择题_vue最新面试题
- vue源码分析-组件
- vue源码分析-v-model的本质
- 一面高频vue面试题
- VUE组件封装_vue组件内部双向绑定
- ASP.NET MVC4开发指南_vue mvc
- vue动态引入js文件的方法_vue如何引入js文件
- IDEA+SSM+SpringBoot+Vue+Element UI实现班级管理增删改查
- vue源码分析-响应式系统工作原理_2023-03-01
- vue中v-cloak解决刷新或者加载出现闪烁显示变量问题
- 后端人眼中的Vue(四)
- Vue动态刷新Echarts数据
- Vue + Ts
- 每日一题之请描述Vue组件渲染流程_2023-02-23
- Vue组件滚动加载、懒加载功能的实现,无限滚动加载组件实例演示
- Vue 实现图片监听鼠标滑轮滚动实现图片缩小放大功能
- Vue 指令之v-bind指令绑定属性
- Vue2.0 搭建Vue脚手架(vue-cli)详解编程语言
- 使用Vue框架使用MSSQL数据库实现快速开发(vue mssql)
- 优雅的Vue请求Redis驱动的高性能服务(vue请求redis)
- Vue搭配Redis做针对性取值(vue redis取值)