Vue.js前后端分离登录框渗透实战：通过信息泄露突破管理员后台

在针对一个采用前后端分离架构的Web系统进行授权渗透测试时，登录框往往是第一个需要突破的关卡。本文详细记录了一次从登录框开始，通过细致的接口测试与信息泄露，最终进入管理员后台的完整过程。

信息收集与前期侦查

目标站点为一个典型的登录页面。通过观察URL中的 # 符号以及使用 Wappalyzer 插件，确认该站点使用 Vue.js 框架构建，并使用了 Webpack 作为打包工具。对于此类前后端分离的应用，前期的渗透思路可以围绕以下几点展开：

1. 寻找常规接口的未授权访问漏洞。
2. 尝试拼接 # 路由或使用 VueCrack 等插件访问隐藏的前端路由，以触发后端接口。
3. 收集全量的 chunk 异步 JS 文件，通过正则脚本提取所有可能的 API 接口。

登录框基础测试

首先对登录功能进行测试，发现系统存在用户名枚举漏洞：当输入存在的用户但密码错误时，提示信息为“密码不正确”，而非“用户名或密码错误”。确认 admin 用户存在后，尝试使用 TOP3000 的弱口令字典进行爆破，但未发现弱口令。考虑到管理员账号可能并非预设的 admin，爆破思路需要调整。
随后测试了 SQL 注入（单双引号、万能密码）等常见漏洞，均无果。这属于正常情况，因此测试重点转向后端接口。

定位后端接口与未授权测试

通过浏览器开发者工具的网络请求捕获，发现前端页面域名为 a.com，而后端实际提供服务的 API 地址为另一个域名 api-xxxxxx.com。这是 前后端分离架构 的典型特征，后续所有接口测试都应在 api-xxxxxx.com 这个域名上进行。

使用插件（如雪瞳）捕获到了大量完整的 API 路径。我们首先对 GET 类型的接口进行路径拼接测试，尝试访问如 /user/list 这类可能存在的管理接口。但所有请求均返回状态码 500 及“请先登录”的提示，表明基础的接口鉴权有效。

接着尝试 POST 请求，同样被鉴权拦截，无法获取任何有效信息。对接口路径进行简单的 Fuzz 测试也未能突破。

利用Vue路由触发接口

第一个方案受挫后，转而利用 Vue 应用的路由特性。通过手动访问 /#/userAccount、/#/SpManagement 等可能的哈希路由，尝试触发其他未在前台展示的功能接口，并观察是否会有新的 API 调用。在访问 /#/register 注册页面时，成功触发了注册接口。

提交注册信息后，系统返回了一个有效的 JWT 令牌。这意味着我们获得了一个低权限的账号凭证。尽管使用该账号密码无法正常登录前台（提示部门错误），但这枚 JWT 可以用于后续的接口鉴权测试。

携带低权限JWT进行深入测试

将获取到的 JWT 令牌添加到请求头中，重新对之前捕获的接口进行测试。这次，GET /student/export 接口返回了数百条学生敏感信息。

受此启发，尝试将路径中的 student 替换为 teacher，成功访问 /teacher/export 接口，泄露了全部教职工信息，表格中包含了工号等关键信息。

关键发现：接口分页参数

在分析流量时，发现部分接口的请求中包含了 pageNum 和 pageSize 参数。模仿此格式，在测试其他接口时主动添加这些分页参数，例如 /plan/task/manager/list/export?pageNum=1&pageSize=99。此举导致了更大规模的数据泄露，一次性获取了超过3000条包含姓名、手机号的二要素信息。

挖掘相对路径接口

除了插件捕获的绝对路径接口，在流量中还发现了形如 role/register 的相对路径接口（前置缺少 /）。此类接口通常会被插件归类到“相对路径”模块中，容易被忽略。将其修正为 /role/register，并附带上低权限 JWT 和分页参数，进行批量测试。

结果发现了大量新的信息泄露点，包括内部人员清单、学生课题研究文件（可下载）、以及新的敏感数据表。

最终突破：获取管理员凭据

在泄露的信息中，仔细翻阅接口返回的数据，找到了系统管理员的账号。尝试使用常见弱口令进行密码喷洒，最终使用 m01/abc123 成功登录系统管理员后台。

总结

本次渗透测试从单一的登录框入手，通过前端框架特性分析、后端接口定位、低权限凭证获取、分页参数利用以及深度接口挖掘等一系列连贯操作，逐步扩大信息泄露面，最终凭借泄露的管理员账号和弱口令成功突破。整个过程体现了在 Web安全测试 中，对应用架构的理解、对细节的观察以及对已获信息的灵活利用至关重要。同时，也暴露出目标系统在 JWT 鉴权逻辑、接口权限控制以及敏感信息返回过滤等方面存在的安全隐患。