IAZARA/Juego_Ciberseguridad
GitHub: IAZARA/Juego_Ciberseguridad
一款移动端优先的网络安全教育游戏，通过七个互动关卡帮助用户在模拟场景中学习钓鱼识别、密码安全和数字卫生习惯。
Stars: 0 | Forks: 0
CyberShield
一个互动且游戏化的工作坊，旨在通过真实场景学习网络安全和数字素养。
预览 · 使用方法 · 关卡 · Stack · 本地运行 · Docker · 部署
| 
| 
|
## 关于本项目
CyberShield 是一款 mobile-first 的教育体验应用，旨在培训在互联网中生存的关键技能：
该游戏将安全概念转化为具体的决策：检测钓鱼、识别可疑链接、避免二维码陷阱、应对设备被盗以及创建强密码。
## 标签
`cybersecurity` `digital-hygiene` `phishing` `education` `game` `mobile-first` `javascript` `express` `railway`
## 如何使用
CyberShield 在浏览器中进行游戏，非常适合在移动端屏幕或响应式视图中使用。用户可以选择语言，通过 7 个关卡并解决模拟的安全决策。每个屏幕都会提供即时反馈以强化判断标准：阅读现状、思考风险并谨慎行事。
用于工作坊或课堂时：
1. 投影或分享游戏的 URL。
2. 要求每位参与者在自己的手机上完成关卡。
3. 将错误和正确的决定作为话题的切入点。
4. 以最终的数字素养清单作为结束。
用于个人使用时：
1. 打开 app。
2. 选择语言。
3. 按顺序完成挑战。
4. 重复您失败的关卡以巩固学习。
## 关卡
| # | 模块 | 主要学习内容 |
|---|--------|------------------------|
| 1 | 权限陷阱 | 在接受侵入性条件前进行阅读。 |
| 2 | 钓鱼侦探 | 识别发件人、虚假紧急情况和危险链接。 |
| 3 | 互动场景 | 解决 juice jacking、公共 WiFi、QRishing 和 vishing 的相关情况。 |
| 4 | 紧急协议 | 手机被盗时关键操作的排序。 |
| 5 | 强密码 | 利用实时反馈构建强密码。 |
| 6 | Digital Shield | 验证诸如 2FA、补丁和零信任等保护习惯。 |
| 7 | 证书 | 以一项可分享的成就结束工作坊。 |
## Stack
| 领域 | 技术 |
|------|------------|
| 前端 | HTML5, CSS3, 原生 JavaScript |
| UI | 自定义 CSS, Google Material Symbols, 通过 CDN 引入的 Tailwind 工具类 |
| 后端 | Node.js + Express |
| 架构 | 由 `public/` 提供服务的 Single Page Application |
| 容器 | Docker + Docker Compose |
| 部署 | Railway, Render 或任何 Node.js/Docker 主机 |
## 结构
```
.
|-- public/
| |-- index.html
| |-- styles.css
| |-- game.js
| `-- translation.js
|-- docs/
| `-- assets/
| |-- cybershield-banner.png
| |-- preview-splash.png
| |-- preview-phishing.png
| `-- preview-password.png
|-- server.js
|-- Dockerfile
|-- docker-compose.yml
|-- SECURITY.md
|-- package.json
`-- README.md
```
## 本地运行
```
git clone https://github.com/IAZARA/Juego_Ciberseguridad.git
cd Juego_Ciberseguridad
npm install
npm start
```
然后打开：
```
http://localhost:3000
```
如果端口 `3000` 被占用，您可以使用其他端口：
```
PORT=3001 npm start
```
在 PowerShell 中：
```
$env:PORT=3001
npm start
```
分享项目前用于检查的实用命令：
```
npm run check
npm run audit
```
## Docker
无需在本地配置 Node.js 即可运行 CyberShield 的最简单方法是使用 Docker。
### 选项 1：Docker Compose
```
docker compose up --build
```
然后打开：
```
http://localhost:3000
```
停止运行：
```
docker compose down
```
### 选项 2：Docker CLI
```
docker build -t cybershield-game .
docker run --rm -p 3000:3000 cybershield-game
```
您也可以使用包含的脚本：
```
npm run docker:build
npm run docker:run
```
该容器在生产模式下运行，暴露 `3000` 端口，使用非 root 用户，在最终的 runtime 中移除了包管理器，并具有 HTTP healthcheck。
## 安全性
Express 服务器为静态 app 应用了防御性 headers：
- `Content-Security-Policy` 仅限于自身资源、Google Fonts 和游戏使用的教育图像。
- `X-Frame-Options: DENY` 和 `frame-ancestors 'none'` 以防止 clickjacking。
- `X-Content-Type-Options: nosniff`。
- `Permissions-Policy` 屏蔽了摄像头、麦克风、地理位置和支付。
- 当 app 在 HTTPS 后面运行时的 `Strict-Transport-Security`。
- 禁用了 `x-powered-by`。
## 部署
该仓库已准备好部署到 Railway、Render 或任何兼容 Node.js 或 Docker 的平台。
1. 创建一个新项目。
2. 从 GitHub 选择此仓库。
3. 使用 `npm start` 作为启动命令。
4. 从提供商的面板生成公共域名。
如果您的提供商支持 Docker，您也可以直接从 `Dockerfile` 进行部署。
## 作者
由 **Iván Agustín Zárate** 创建。
## 许可证
在 MIT 许可证下分发。查看 [LICENSE](LICENSE) 了解更多信息。标签：GNU通用公共许可证, MITM代理, Node.js, Vanilla JS, 安全教育, 游戏化学习, 版权保护, 移动优先, 网络安全意识培训, 自定义脚本, 请求拦截