如何还原前端代码

前言

在渗透测试时，经常会遇到以js.map为后缀的文件

这是jQuery中的一个新功能，支持Source Map

非常多Webpack打包的站点都会存在js.map文件.

通过还原前端代码找到API,间接性获取未授权访问漏洞

什么是Source map

简单说，Source map就是一个信息文件，里面储存着位置信息。转换后的代码的每一个位置，所对应的转换前的位置。

有了它，出错的时候，除错工具将直接显示原始代码，而不是转换后的代码,这无疑给开发者带来了很大方便。

工具介绍

目前大多数人使用比较多的是以下两个

• restore-source-tree

https://www.npmjs.com/package/restore-source-tree

• shuji

https://github.com/paazmaya/shuji

这2个项目各有利弊，但并不是今天介绍的主角

今天要介绍的是

• reverse-sourcemap

https://www.npmjs.com/package/reverse-sourcemap

虽然是几年前开发的项目但对文件和目录的还原与其他两个比较更加优秀，文件和目录都能全部还原出来。

• restore-source-tree可以还原目录，但一些文件会出现还原不了的情况
• shuji可以还原文件，但同名的文件会出现忽略且不保存的情况

安装reverse-sourcemap

• 此处以Windows平台为例

去官网下载适合自己操作系统nodejs

https://nodejs.org/zh-cn/download/

运行并安装，选择Next

同意协议 选择Next

选择安装路径

继续Next

根据自身情况进行选择是否勾选,继续Next，并选择install进行安装

安装完成后执行以下语句,确认环境是否正常

C:Users小生观察室>npm -v
8.3.1

环境无异常之后开始安装reverse-sourcemap

C:Users小生观察室>npm install --global reverse-sourcemap

added 13 packages, and audited 14 packages in 2s

found 0 vulnerabilities
npm notice
npm notice New minor version of npm available! 8.3.1 -> 8.5.3
npm notice Changelog: https://github.com/npm/cli/releases/tag/v8.5.3
npm notice Run npm install -g [email protected] to update!

确认reverse-sourcemap是否异常

C:Users小生观察室>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

Version 1.0.4

还原代码

C:Users小生观察室>reverse-sourcemap -v Root-5712cd11ab11386d4a3e.js.map -o output
reverse-sourcemap - Reverse engineering JavaScript and CSS sources from sourcemaps
Going to process total of 1 files
Outputting to directory: C:Users小生观察室output
Processing file Root-5712cd11ab11386d4a3e.js.map
All sources were included in the sourcemap
Writing to file C:Users小生观察室outputwebpacksrcscenesRootRoot.tsx

还原后的最终效果