Adv2：前端交互
在本实验中，你不需要掌握 javascript, html, css 网页三件套，仅需使用封装过的 python
streamlit库即可
什么是 streamlit？¶
streamlit 是一个用 Python 快速开发 Web 应用的开源框架。你可以用纯 Python 代码，像写脚本一样写出交互式网页，无需掌握 HTML/CSS/JS。
streamlit 的特点：
- 只用 Python 代码即可生成网页界面
- 支持表单、按钮、输入框、文件上传等常用交互
- 适合数据展示、原型开发、与后端 API 对接
- 一行命令即可本地运行（streamlit run app.py）
本模块要求你使用 streamlit 实现前端交互，不要求使用传统的 HTML/CSS/JS 三件套。你只需用 Python + streamlit 搭建一个 Web 界面，调用后端 API，完成用户登录、代码提交、结果查询等功能。
模块目标¶
实现一个 streamlit 前端，可与后端 API 交互，支持用户登录、题目展示、代码提交、结果查询等功能。
前置知识要求¶
| 技术点 | 推荐学习内容 |
|---|---|
| HTML/JS 基础 | 表单、AJAX |
| REST API 调用 | fetch/axios |
| Cookie/Session | 前端存储与传递 |
任务分解¶
任务 1：用户登录与身份管理¶
只有登录后用户才能进行题目提交、结果查询等操作，需安全地保存身份信息。前端需要实现登录表单，调用后端登录 API，完成用户身份认证。
- 实现建议：
- 可用 session_state 或本地文件存储 token。
- 登录失败时给出友好提示。
任务 2：代码提交与结果查询¶
用户需要通过网页提交代码，并能实时查看评测状态和结果。前端需实现代码提交表单，调用后端提交 API，并展示评测结果。
- 实现建议：
- 使用 streamlit 的文本框、下拉框等组件收集题号、语言、代码内容。
- 调用后端提交 API，获取 submission_id。
- 轮询或手动查询 submission_id 的评测状态与结果，并展示。
任务 3：前端与后端接口对接¶
前后端分离架构下，所有数据流转均依赖 API，需保证参数、路径、状态码一致。需确保所有前端操作均通过 REST API 与后端交互，严格遵循接口规范。
- 实现建议：
- 按文档实现 API 路径、参数、请求方式。
- 可封装 API 调用函数，统一处理请求和异常。
- 文档与实现保持同步，便于查阅和测试。
评分细则¶
| 功能/接口 | 分值 | 评分说明 |
|---|---|---|
| 前端与后端接口对接 | 2 | REST API 交互、路径、参数 |
| 登录与身份管理 | 1 | 登录表单、身份存储 |
| 代码提交与结果查询 | 1 | 提交表单、结果展示 |
| 规范接口与安全说明 | 1 | 严格遵循 API 规范、安全说明 |
| 小计 | 5 |
作者：