AryanChadokar59/Hidden-Flag-WebCTF
GitHub: AryanChadokar59/Hidden-Flag-WebCTF
一个面向初学者的Web类CTF挑战项目，通过登录门户场景教授浏览器开发者工具使用、JavaScript代码检查和Base64解码技能。
Stars: 0 | Forks: 0
# 🔒 隐藏的开发者控制台
## 挑战信息
| 字段 | 详细信息 |
|---------------------|--------------------------|
| **挑战名称** | Hidden Developer Console |
| **类别** | Web |
| **难度** | Easy |
| **Flag 格式** | `GCS{...}` |
# 挑战概述
**Hidden Developer Console** 是一个适合初学者的 Web 夺旗赛 (CTF) 挑战，旨在向参与者介绍浏览器开发者工具和基本的客户端安全概念。
参与者会看到一个登录门户，它似乎会拒绝所有的登录尝试。然而，该应用程序包含一个隐藏的开发者模式，只能通过发现一个秘密交互来激活。激活后，浏览器的开发者控制台中会显示一条编码消息。参与者必须识别编码方式，解码消息，并获取隐藏的 flag。
该挑战旨在教导用户超越可见界面，检查应用程序的底层行为。
# 故事背景
一个开发团队最近为管理员开发了一个内部登录门户。
在开发过程中，其中一名开发者为了调试目的，在应用程序中意外留下了一个隐藏的 **开发者模式**。
管理层原以为它在部署前已经被移除了。
你的任务是调查该门户，发现隐藏的开发者功能，并恢复开发者留下的秘密 flag。
你能揭开那些本不该被看到的东西吗？
# 学习目标
完成本挑战后，参与者将了解：
- 浏览器开发者工具
- HTML 和 JavaScript 检查
- 基于事件的交互
- 客户端安全概念
- Base64 编码与解码
- 为什么敏感信息绝不应该存储在客户端
# 要求
- Google Chrome、Microsoft Edge 或 Mozilla Firefox
- 无需其他软件
# 设置说明
1. 下载或克隆此代码库。
```
git clone
```
2. 打开项目文件夹。
3. 双击 **index.html**
或者
在您首选的 Web 浏览器中打开 **index.html**。
无需 Web 服务器。
# 挑战目标
找回隐藏的 flag。
登录页面将始终拒绝您的凭据。
仔细调查该应用程序。
记住：
# 挑战文件
```
Hidden-Developer-Console/
│── index.html
│── style.css
│── script.js
│── README.md
```
# 预期解题路径
1. 打开网站。
2. 观察到每次登录尝试都失败了。
3. 探索页面以寻找异常行为。
4. 点击门户徽标五次。
5. 出现一条消息，提示开发者模式已启用。
6. 打开浏览器开发者工具 (`F12`)。
7. 导航到 **Console** 选项卡。
8. 找到控制台中显示的 Base64 编码字符串。
9. 解码 Base64 字符串。
10. 获取 flag。
# Flag
```
Congratulations ! You Successfully Logged In
```
# 涉及的技术概念
- HTML
- CSS
- JavaScript
- DOM 事件
- 事件监听器
- 浏览器控制台
- Base64 编码
- 基本 Web 安全
# 教育目的
此挑战演示了开发者有时是如何在开发过程中将敏感信息留在客户端代码中的。
参与者将了解到：
- JavaScript 中可能存在隐藏功能。
- 浏览器开发者工具在 Web 安全评估中是必不可少的。
- 客户端代码绝不应包含机密信息。
- Base64 是一种编码技术，而不是加密。
# 挑战演练（面向组织者）
1. 打开应用程序。
2. 点击 **🔏 My Secure Login ** 徽标五次。
3. 开发者模式激活。
4. 打开浏览器控制台。
5. 复制编码后的文本。
6. 使用任何 Base64 解码器或浏览器的 `atob()` 函数对其进行解码。
7. 获取 flag。
# 作者
**姓名：** Aryan Chadokar
# 许可协议
本项目出于教育目的而创建，是夺旗赛 (CTF) 实习作业的一部分。
标签：Base64, OPA, Web安全, 前端调试, 后端开发, 多模态安全, 数据可视化, 网络安全, 蓝队分析, 隐私保护, 靶场