从前端信息泄露进行漏洞挖掘 - 教学文档

1. 前端信息泄露概述

前端信息泄露是指通过分析网站前端代码、静态资源、调试信息等获取敏感数据或发现潜在漏洞的技术手段。这类漏洞往往被忽视，但可能成为渗透测试中的突破口。

2. Webpack打包工具分析

2.1 Webpack简介

• 前端资源加载/打包工具
• 根据模块依赖关系进行静态分析
• 将多种静态资源(js、css、less)转换为静态文件
• 减少页面请求数量
• 基于Node.js环境

2.2 Webpack泄露风险

• 可能包含未压缩的源代码
• 暴露API接口路径
• 包含敏感配置信息
• 揭示后端框架信息(如SpringBoot)

3. 实战漏洞挖掘流程

3.1 信息收集阶段

1. 使用浏览器开发者工具(F12)检查
2. 重点关注static目录
3. 查找webpack相关目录和文件
4. 分析JavaScript源代码

3.2 API接口发现

• 从Webpack打包文件中提取API端点
• 分析接口URL结构
• 识别后端框架特征(如SpringBoot)
• 使用专用字典进行测试(如SpringBoot漏洞字典)

3.3 敏感参数获取

1. groupId获取方法：

   • 分析JavaScript代码
   • 发现子域名与ID的对应关系
   • 通过前端逻辑获取特定子域名的groupId

2. access_token获取方法：

   • 检查Cookie存储
   • 注册功能可能自动分配token
   • 登录后系统自动设置

3.4 漏洞利用案例

1. SSRF潜在风险：

   • 发现图片存储地址由服务器控制
   • 若能修改存储地址，可能造成SSRF
   • 验证地址参数是否可控

2. 参数篡改测试：

   • 获取必要参数(groupId, access_token)
   • 构造修改请求
   • 验证响应状态(200成功)

3. DNSlog验证：

   • 用于验证SSRF等漏洞
   • 观察是否有外部请求到达

4. 防御建议

4.1 开发层面

• 避免在前端代码中硬编码敏感信息
• 对Webpack等打包工具进行生产环境优化
• 实现API接口的适当权限控制
• 对用户输入进行严格过滤

4.2 运维层面

• 禁用不必要的调试信息
• 定期进行安全审计
• 实施严格的CORS策略
• 监控异常API访问模式

5. 总结

前端信息泄露漏洞挖掘的关键点：

1. 细致分析前端静态资源
2. 关注Webpack等打包工具的输出
3. 系统性地收集API接口信息
4. 追踪敏感参数获取路径
5. 验证参数可控性和影响范围

通过这种方法，即使看似无害的前端文件也可能成为发现高危漏洞的突破口。渗透测试中应当前后端并重，不放过任何细节。