CTF-Quiz 使用文档

本文档说明如何在尽量少改动的前提下使用 CTF-Quiz 项目。

1. 项目结构

• 前端：React + Vite
• 后端：Node.js + Express
• 题库配置：CTF-Quiz/server/questions.cjs
• 后端入口：CTF-Quiz/server/index.cjs
• 前端构建产物：CTF-Quiz/dist

前端不包含答案字段，答案校验由后端 API 完成。

2. 环境要求

• 建议 Node.js 18+
• 建议 npm 9+
• Docker（需要构建容器镜像时）

3. 本地开发

在项目目录打开终端：

cd CTF-Quiz
npm ci

启动后端：

npm run server

启动前端开发服务器（新开一个终端）：

cd CTF-Quiz
npm run dev

默认端口：

• 前端开发端口：5173
• 后端 API 端口：3000

vite 已配置 /api 代理到 http://localhost:3000。

4. 本地生产构建

构建前端：

cd CTF-Quiz
npm run build

以生产方式运行（先构建再由后端托管 dist）：

npm start

后端会同时提供静态页面与 API。

5. 题库配置

编辑文件：

• CTF-Quiz/server/questions.cjs

每道题字段说明：

• id
• content
• answer
• attachments（可选）
• hints（可选）

示例：

{
  id: 1,
  content: "HTTP 默认端口是多少？",
  answer: "80",
  attachments: [],
  hints: ["小于 100"]
}

注意事项：

• id 必须唯一。
• 题目顺序应与预期解题顺序一致。
• 后端使用 trim() + 不区分大小写进行答案比对。

6. Flag 配置

后端从环境变量读取 flag：

• GZCTF_FLAG

若未设置，默认值为：

• flag{default_flag}

7. Docker 构建与运行

构建镜像：

cd CTF-Quiz
docker build -t ctf-quiz:1.0 .

运行容器：

docker run -d --name ctf-quiz -p 8080:80 -e GZCTF_FLAG="flag{test_flag}" ctf-quiz:1.0

浏览器访问：

• http://localhost:8080

8. 推送镜像（可选）

docker tag ctf-quiz:1.0 <registry>/<namespace>/ctf-quiz:1.0
docker push <registry>/<namespace>/ctf-quiz:1.0

9. CTF 靶场部署流程

常见流程：

1. 本地构建镜像。
2. 推送到镜像仓库。
3. 靶场节点拉取镜像。
4. 平台将宿主机端口映射到容器 80 端口。
5. 选手通过 host:port 访问题目服务。

10. API 说明

• GET /api/questions
  • 返回题目信息与进度，题目中不包含答案字段。
• POST /api/submit
  • 按当前进度校验提交答案。
• GET /api/flag
  • 仅在全部题目通过后返回 flag。

11. 常见问题排查

• npm run build 失败
  • 重新执行 npm ci 后再构建。
• Docker 拉取或构建失败
  • 检查 Docker 网络、代理和镜像仓库可达性。
• 无法获取 flag
  • 确认题目按顺序全部答对。