法考主观题AI模拟答题系统 · html开发文档
版本：v1.1
目标：构建一个可在浏览器端运行的法考主观题模拟答题HTML应用，具备自动出题、考生作答、AI智能评分三大核心能力。
适用场景：法考主观题自测练习、AI辅助批改演示、轻量级刷题工具。
一、需求概览
- 本人于2023年通过法考，也曾折戟过一次主观题（差1分），但是复习时候没有现在的AI技术，基本是靠培训机构的模拟机和真题以及网上的材料进行主观题训练，故本作品旨在构建一个轻量化的html页面，使得备考人员可以通过自行接入AI大模型，实现AI出题，AI批改和得分点，也是效仿了实际法考主观题的真题难度和形式进行的了模仿，希望最大程度还原真实考试环境，从而帮助备考人员少走一些弯路，提高效率。
1.1 核心故事线
- 用户打开页面 → 选择作答学科（刑法/刑诉/民法+民诉/行政法/商法/论述题）
- 点击“生成题目” → 系统调用AI大模型，根据内置命题规则自动生成一道主观题（含案情+设问）
- 用户在文本框中输入答案
- 点击“提交批改” → 系统将题目+答案发送至AI评分服务，返回多维度评分、采分点分析和改进建议
- 用户查看评分结果，可继续生成新题或修改答案重新提交
1.2 功能清单
| 模块 | 功能点 | 优先级 |
|---|---|---|
| 题目生成 | 学科/题型选择（6选1） | P0 |
| 自动调用AI生成题目（案情 + 问题） | P0 | |
| 题目本地缓存（同一学科保留最近一次） | P1 | |
| 答题区域 | 纯文本输入（支持简单格式） | P0 |
| 字数统计与剩余时间提醒 | P1 | |
| AI评分 | 提交答案 → 获得总分 | P0 |
| 多维度评分（结论/法条/逻辑/展示） | P0 | |
| 采分点逐项对比（得分/失分明细） | P0 | |
| 改进建议与常见失分点提示 | P1 | |
| 用户界面 | 响应式布局（Desktop为主） | P0 |
| 得分结果可视化（仪表盘） | P0 | |
| 历史记录查看（本次会话） | P2 |
1.3 非功能需求
- 首次出题时间 < 15秒（取决于AI API延迟）
- 评分返回时间 < 10秒
- 界面适配Chrome/Edge/Safari最新版
- API密钥安全存储（浏览器本地加密，仅开发/个人使用）
二、技术栈
| 分层 | 技术选型 | 说明 |
|---|---|---|
| 框架 | 纯HTML/CSS/JS（无框架） | 零依赖，可直接打开使用 |
| UI库 | Tailwind CSS (CDN) + 自定义样式 | 原子化样式，快速构建 |
| 富文本 | 自定义轻量编辑器（基于contenteditable） | 避免引入大型库，或仅用textarea |
| 状态管理 | 原生js对象 + localStorage | 管理当前题目、学科、答案状态 |
| HTTP客户端 | Fetch API | 调用AI API |
| AI服务 | 多模型 API 适配层（兼容 OpenAI 格式） | 支持 DeepSeek / OpenAI / 通义千问 / 月之暗面 / 智谱 GLM 等，用户可在设置面板自由切换 |
| 图标 | Heroicons (CDN) 或 emoji | 简洁图标 |
| 部署 | 任意静态服务器/GitHub Pages | 纯前端 |
为什么不使用框架？
此应用页面结构简单（单页，局部刷新），无需复杂路由或状态管理。纯原生实现便于快速交付，无打包构建步骤。
三、系统架构
3.1 整体架构图
┌────────────────────────────────────────────┐
│ 浏览器 (HTML App) │
│ ┌──────────────┐ ┌──────────────────────┐ │
│ │ 界面组件 │ │ 核心引擎 │ │
│ │ - 学科选择 │ │ - 出题Prompt构造器 │ │
│ │ - 题目展示 │ │ - 评分Prompt构造器 │ │
│ │ - 答题输入 │ │ - API调用封装 │ │
│ │ - 评分结果 │ │ - 本地缓存管理 │ │
│ └──────────────┘ │ - 多模型配置管理 │ │
│ └──────────────────────┘ │
└──────────────────┬─────────────────────────┘
│ HTTPS
▼
┌─────────────────────────────────┐
│ AI API 适配层 │
│ （根据用户选择动态切换） │
│ baseURL / model / apiKey │
│ 均由用户在前端设置面板指定 │
└──────┬────────────┬─────────────┘
│ │
┌────────┴──┐ ┌─────┴──────────┐
│ DeepSeek │ │ OpenAI 兼容 │
│ API │ │ API 系列 │
│ │ │ - 通义千问 │
│ │ │ - 月之暗面 │
│ │ │ - 智谱GLM │
│ │ │ - 零一万物 │
│ │ │ - MiniMax │
└───────────┘ └─────────────────┘
API调用方式：系统在设置面板中内置了多个主流 API Provider 的预设，用户只需选择 Provider、填入对应 API Key 即可使用。所有 Provider 均基于 OpenAI 兼容接口协议（/v1/chat/completions），底层通过统一的 callAI() 函数根据所选 Provider 动态切换 baseURL 和 model。为保护 API Key，推荐使用简易后端代理（如 Vercel Serverless Function），但 MVP 阶段允许前端直接调用（Key 存储于 localStorage，教育用途，风险可控）。
3.2 数据流图
[用户选择学科]
│
▼
[构造出题Prompt]
│
▼
[读取用户选择的 AI Provider 配置] (baseURL / model / apiKey)
│
▼
[调用统一 API 适配层] → Fetch('{baseURL}/chat/completions', {model, messages, ...})
│
▼
[解析AI返回JSON] → 提取{案情, 问题, 参考答案, 采分点}
│
▼
[渲染题目区域 + 存储参考答案(隐藏)]
│
▼
[用户输入答案] → 点击“提交批改”
│
▼
[构造评分Prompt] → 调用统一 API 适配层（使用同一 Provider）
│
▼
[解析评分JSON] → 提取{总分, 维度分, 采分点对比, 评语}
│
▼
[渲染评分结果面板]
四、详细设计
4.1 页面布局
采用经典左右分栏布局（Desktop），移动端自动堆叠。
┌──────────────────────────────────────────────────────────┐
│ Header: 🏛️ 法考主观题AI训练营 [⚙️ 设置API Key] │
├──────────────────────────────────────────────────────────┤
│ 学科选择: [刑法] [刑诉] [民法+民诉] [行政法] [商法] │
│ [法治思想论述题] [✨ 随机出题] │
├────────────────────────────┬─────────────────────────────┤
│ 📋 题目区域 (50%) │ ✍️ 答题区域 (50%) │
│ │ │
│ 【案情材料】 │ [作答文本框] │
│ ..................... │ ..................... │
│ ..................... │ ..................... │
│ ..................... │ ..................... │
│ │ │
│ 【问题】 │ 字数: 0/5000 │
│ 1. ...... │ │
│ 2. ...... │ [提交批改] 按钮 │
│ ... │ │
│ ├─────────────────────────────┤
│ │ 📊 评分结果 (点击提交后) │
│ │ ⭐ 总分: 28/35 │
│ │ ▸ 结论正确性: 8/10 │
│ │ ▸ 法条适用: 7/8 │
│ │ ▸ 论证逻辑: 6/10 │
│ │ ▸ 法言法语: 4/4 │
│ │ 📝 采分点对比: │
│ │ ✅ 已得分点... │
│ │ ❌ 失分点... │
│ │ 💡 改进建议: ... │
└────────────────────────────┴─────────────────────────────┘
4.2 核心模块设计
4.2.1 出题模块（Generation Engine）
功能：根据学科选择，构建结构化Prompt，请求AI生成题目。
Prompt设计（以刑法为例，已内嵌先前设计的命题规则）：
function buildGenerationPrompt(subject) {
const basePrompt = {
"刑法": `你是一位资深法考命题专家。请随机生成一道法考主观题**刑法案例分析题**，总分35分。
【命题要求】
- 案情700-1500字，人物用甲、乙、丙等代号，涉及2-4个罪名
- 必须包含至少2处观点展示环节（如具体符合说vs法定符合说、犯罪中止vs未遂等）
- 设置5-7个小问，混合结论判断、观点展示、量刑分析题型
- 需覆盖：共同犯罪、因果关系、罪数形态、自首/立功等核心考点
【输出格式】
请严格按照以下JSON格式返回（不要包含其他文字）：
{
"caseFacts": "案情详细描述...",
"questions": ["问题1...", "问题2...", ...],
"referenceAnswers": [
{
"questionIndex": 1,
"answer": "参考答案...",
"scoringPoints": [
{"content": "采分点描述", "score": 该点分值}
],
"commonMistakes": ["常见错误1", "常见错误2"]
},
...
]
}`
};
// 其他学科类似，参照本对话前序产出制定
return { role: "user", content: basePrompt[subject] };
}
API调用：
- 模型：由用户在设置面板中选择（DeepSeek / 通义千问 / 月之暗面等）
temperature：由随机性滑块（1~10）映射，计算公式temperature = 0.2 + (随机值 - 1) × 0.09，范围 0.2~1.02。随机性越高，每次生成的案情和考点组合差异越大response_format: { type: "json_object" }（约束JSON输出）
难度与随机性量化：
- 难度三级（简单/中等/困难）通过 Prompt 中的
{DIFFICULTY}占位符注入详细描述：- 简单：案情简单清晰、法律关系直接、考点较为基础
- 中等：案情适中、包含一定复杂情节、问题有一定深度和综合度
- 困难：案情复杂、涉及多个法律争议点和跨章节考点、问题具有较高难度和综合性
- 随机性（1~10 滑块）控制 AI 的
temperature参数，数值越大生成的题目变化越丰富
各学科题目数量：
| 学科 | 题目数量 |
|---|---|
| 刑法 | 4~6 问 |
| 刑诉 | 6 问 |
| 民法+民诉 | 11~13 问 |
| 行政法 | 6 问 |
| 商法 | 6 问 |
| 法治思想论述题 | 1 问（大论述） |
异常处理：若AI返回格式解析失败，向用户展示错误信息并允许重试。
4.2.2 答题模块
- 提供多行
<textarea>，行高至少20，宽度100%。 - 答案长度不做硬性限制，但显示字数统计。
- 保存用户草稿至
localStorage，防止误关闭丢失。 - 可选提供简易格式化工具栏（加粗、引用法条样式），但MVP阶段用纯文本即可。
4.2.3 AI评分模块（Grading Engine）
功能：将题目、参考答案和学生答案打包，调用AI进行多维度评分。
评分Prompt设计（贯彻“采分点矩阵”理念）：
function buildGradingPrompt(questionData, studentAnswer) {
return `
你是一位法考主观题阅卷专家。请根据以下信息批改学生答案：
【题目】
${questionData.caseFacts}
【问题】
${questionData.questions.join('\n')}
【参考答案与采分点信息】
${JSON.stringify(questionData.referenceAnswers, null, 2)}
【学生答案】
${studentAnswer}
【评分要求】
1. 从“结论正确性”、“法律适用准确性”、“论证逻辑完整性”、“法条引用规范性”、“法言法语表达”五个维度评分（每个维度满分10分）。
2. 逐项对比采分点，判断学生是否命中。对每个采分点给出“命中/部分命中/未命中”判定，并说明理由。
3. 给出总分（总分 = 采分点实际得分累加，确保与题目设定总分一致）。
4. 输出改进建议（不超过3条）。
请严格按照以下JSON格式输出：
{
"totalScore": 总分,
"maxScore": 题目满分,
"dimensionScores": {
"conclusion": 8,
"legalAccuracy": 7,
"logic": 6,
"citation": 5,
"language": 7
},
"pointsComparison": [
{
"pointDescription": "采分点原文",
"maxPointScore": 该点分数,
"studentHit": "命中/部分命中/未命中",
"comment": "评语"
}
],
"suggestions": "改进建议..."
}
`;
}
注意：为防止AI评分偏差，可多次调用并取均值，但MVP阶段单次调用即可。
4.2.4 API密钥管理模块
提供设置面板，用户可在其中：
- 选择 AI Provider（DeepSeek / 通义千问 / 月之暗面 / 智谱 GLM 等）
- 填入对应 Provider 的 API Key
- 调整出题难度（简单 / 中等 / 困难）
- 调整题目随机性（1~10 滑块）
所有配置存储于 localStorage，每次调用时读取。
// Provider 预设配置
const API_PROVIDERS = {
deepseek: {
name: 'DeepSeek',
baseURL: 'https://api.deepseek.com/v1',
model: 'deepseek-chat',
docs: 'https://platform.deepseek.com/api_keys'
},
openai: {
name: 'OpenAI',
baseURL: 'https://api.openai.com/v1',
model: 'gpt-4o',
docs: 'https://platform.openai.com/api-keys'
},
tongyi: {
name: '通义千问',
baseURL: 'https://dashscope.aliyuncs.com/compatible-mode/v1',
model: 'qwen-plus',
docs: 'https://help.aliyun.com/zh/model-studio/developer-mode'
},
moonshot: {
name: '月之暗面',
baseURL: 'https://api.moonshot.cn/v1',
model: 'moonshot-v1-8k',
docs: 'https://platform.moonshot.cn/console/api-keys'
},
glm: {
name: '智谱 GLM',
baseURL: 'https://open.bigmodel.cn/api/paas/v4',
model: 'glm-4-plus',
docs: 'https://open.bigmodel.cn/usercenter/apikeys'
}
};
统一 API 调用函数，根据用户选择的 Provider 动态切换 baseURL 和 model：
async function callAI(messages, temperature) {
const provider = localStorage.getItem('faikao_provider') || 'deepseek';
const apiKey = localStorage.getItem(`faikao_api_key_${provider}`);
const config = API_PROVIDERS[provider];
const res = await fetch(`${config.baseURL}/chat/completions`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer ${apiKey}`
},
body: JSON.stringify({
model: config.model,
messages: messages,
temperature: temperature,
response_format: { type: "json_object" }
})
});
const data = await res.json();
return data.choices[0].message.content;
}
学科状态独立保存：每个学科的题目、答案、评分结果通过 SubjectData 对象独立缓存，并持久化至 localStorage。切换学科时自动保存当前学科、恢复目标学科状态，不丢失任何已生成的题目和作答内容。
4.3 界面状态管理
使用一个全局状态对象 + 学科独立缓存：
const AppState = {
subject: '刑法',
questionData: null, // AI生成的原始题目JSON
studentAnswer: '',
gradingResult: null,
isLoading: false,
error: null
};
// 学科独立缓存 —— 切换学科时保存/恢复
let SubjectData = {};
function initSubjectData() {
SUBJECTS.forEach(s => {
SubjectData[s.id] = {
questionData: null,
answer: '',
gradingResult: null
};
});
}
状态管理核心机制：
- 当前学科状态：
AppState对象实时反映当前显示的学科内容 - 学科独立缓存：
SubjectData对象为每个学科保存独立副本，切换学科时调用saveCurrentSubjectState()将当前AppState写入SubjectData[subject]，再调用loadSubjectState(subject)从缓存恢复 - 持久化：
SubjectData序列化后存入localStorage（key:faikao_subject_cache），页面刷新后自动恢复 - 视觉反馈：已有题目的学科标签上显示绿色 ✓ 标记，并新增「清空当前学科」按钮
状态变化时手动更新对应DOM区域，无虚拟DOM，直接操作innerHTML。
4.4 工作流时序
1. 页面加载 → 读取localStorage恢复学科选择、API Provider配置、SubjectData缓存
2. 用户切换学科 → saveCurrentSubjectState() 保存当前学科 → loadSubjectState() 恢复目标学科 → syncUI() 刷新界面
3. 点击“生成题目” → 显示加载动画 → 读取当前 Provider 配置 → 调用统一 API 适配层 → 解析JSON → 渲染题目
4. 用户在文本框输入 → 实时保存至 SubjectData 和 localStorage
5. 点击“提交批改” → 显示加载动画 → 调用统一 API 适配层（评分 Prompt）→ 解析结果 → 渲染评分面板
6. 用户阅读评分 → 可修改答案后重新提交，或生成新题
7. 用户打开设置 → 可切换 Provider / API Key / 难度 / 随机性 → 配置持久化至 localStorage
五、API接口详细定义
5.1 Provider 预设配置表
系统内置以下 AI Provider 预设，用户可在设置面板中切换：
| Provider | baseURL | 默认模型 | 获取 Key |
|---|---|---|---|
| DeepSeek | https://api.deepseek.com/v1 |
deepseek-chat |
platform.deepseek.com |
| OpenAI | https://api.openai.com/v1 |
gpt-4o |
platform.openai.com |
| 通义千问 | https://dashscope.aliyuncs.com/compatible-mode/v1 |
qwen-plus |
help.aliyun.com |
| 月之暗面 | https://api.moonshot.cn/v1 |
moonshot-v1-8k |
platform.moonshot.cn |
| 智谱 GLM | https://open.bigmodel.cn/api/paas/v4 |
glm-4-plus |
open.bigmodel.cn |
所有 Provider 均遵循 OpenAI 兼容接口协议（/v1/chat/completions），系统通过统一的适配层调用。
5.2 生成题目接口（前端封装）
| 项目 | 说明 |
|---|---|
| 方法 | POST |
| URL | {baseURL}/chat/completions（由所选 Provider 决定） |
| Headers | Authorization: Bearer <API_KEY> Content-Type: application/json |
| Body | { "model": "<所选模型>", "messages": [{"role":"system","content":"你是命题专家..."}, {"role":"user","content": "生成刑法题..."}], "temperature": <随机性映射值>, "response_format": {"type": "json_object"} } |
| 成功响应 | { "choices": [{ "message": { "content": "{ ...JSON... }" } }] } |
| 错误处理 | 网络错误重试3次，显示异常信息；JSON解析失败则提示“AI返回格式异常” |
5.3 评分接口（前端封装）
| 项目 | 说明 |
|---|---|
| 方法 | POST |
| URL | {baseURL}/chat/completions（由所选 Provider 决定） |
| Body | { "model": "<所选模型>", "messages": [{"role":"system","content":"你是法考阅卷专家..."}, {"role":"user","content": "评分请求..."}], "temperature": 0.3, "response_format": {"type": "json_object"} } |
| 成功响应 | 同上结构 |
5.4 localStorage 存储键对照表
| 存储键 | 用途 | 格式 |
|---|---|---|
faikao_provider |
当前选择的 AI Provider ID | string（如 "deepseek"） |
faikao_api_key_{provider} |
对应 Provider 的 API Key | string（如 "sk-xxx"） |
faikao_difficulty |
出题难度 | string（"简单" / "中等" / "困难"） |
faikao_randomness |
随机性值 | string（"1" ~ "10"） |
faikao_subject |
当前学科 | string（如 "刑法"） |
faikao_subject_cache |
所有学科的独立缓存数据 | JSON string（SubjectData 序列化） |
安全性提醒：纯前端存放API Key有泄露风险。本应用面向个人开发者或小范围内部使用，建议使用过程中定期轮换Key，或后期改用后端代理。
六、代码结构（HTML文件组织）
法考主观题模拟训练.html
├── <head>
│ ├── Meta + Title
│ ├── Tailwind CSS CDN
│ └── 自定义样式 (内联 <style>)
├── <body class="bg-gray-50">
│ ├── Header 导航栏
│ ├── 学科选择 Tabs
│ ├── 主体容器 (Grid 两栏)
│ │ ├── 左侧：题目展示区 (id="questionPanel")
│ │ └── 右侧：答题区 (id="answerPanel")
│ │ ├── 文本编辑区
│ │ ├── 提交按钮
│ │ └── 评分结果区 (id="resultPanel")
│ └── 设置模态框（API Key 输入）
├── <script> (所有JavaScript逻辑)
│ ├── 配置常量 (Provider预设, API基础配置, Prompts模板)
│ ├── 状态管理 (AppState + 学科独立SubjectData缓存)
│ ├── API调用函数 (统一适配层，根据Provider动态切换)
│ ├── Prompt构造器 (内嵌 {DIFFICULTY} / {QUESTION_COUNT} 占位符)
│ ├── UI渲染函数
│ ├── 学科缓存管理 (保存/恢复/同步/标签标记)
│ └── 事件监听绑定
└── </body>
所有逻辑内嵌在一个<script>标签中，无外部JS依赖（除Tailwind外）。
七、关键代码片段示例
7.1 出题Prompt模板（针对6大学科）
const PROMPT_TEMPLATES = {
"刑法": `请生成一道法考主观题刑法案例分析题(35分)。... (同前)`,
"刑事诉讼法": `请生成一道法考主观题刑事诉讼法案例分析题(30分)。要求：重点考查证据制度与程序合法性审查，包含非法证据排除、认罪认罚从宽等热点，设置4-5个问题...`,
"民法+民事诉讼法": `请生成一道法考主观题民商综合案例分析题(55分)。要求：严格限定作答依据引自《民法典》或《民事诉讼法》，不设商法独立设问，可含公司背景，涉及担保、合同、侵权责任等。设置6-8个问题...`,
"行政法": `请生成一道法考主观题行政法案例分析题(25分)。涉及具体行政行为、行政协议或行政诉讼，设置3-4个问题...`,
"商法": `请生成一道法考主观题商法案例分析题(25分)。核心考查公司法和破产法，可能涉及股东权利、出资瑕疵、破产取回权等，设置3-4个问题...`,
"法治思想论述题": `请生成一道法考主观题法治思想论述题(35分)。给出一段材料，要求结合法治思想论述某实践议题。设置1个大问...`
};
7.2 渲染题目至界面
function renderQuestion(data) {
document.getElementById('caseFacts').innerText = data.caseFacts;
const qList = document.getElementById('questionList');
qList.innerHTML = data.questions.map((q, i) =>
`<li class="mb-2"><span class="font-semibold">问题${i+1}：</span>${q}</li>`
).join('');
// 存储参考答案到状态，不在UI中显示
AppState.questionData = data;
}
7.3 评分结果可视化
function renderGrading(result) {
const html = `
<div class="bg-white rounded-xl shadow p-6 space-y-4">
<div class="flex items-center justify-between">
<h3 class="text-2xl font-bold">得分：${result.totalScore}/${result.maxScore}</h3>
<span class="text-${result.totalScore/result.maxScore > 0.6 ? 'green' : 'red'}-600 font-mono text-lg">${Math.round(result.totalScore/result.maxScore*100)}%</span>
</div>
<div class="grid grid-cols-5 gap-2 text-center">
${Object.entries(result.dimensionScores).map(([k,v]) => `
<div><div class="text-xs text-gray-500">${k}</div><div class="text-lg font-semibold">${v}</div></div>
`).join('')}
</div>
<div class="border-t pt-4">
<h4 class="font-semibold mb-2">采分点对比</h4>
${result.pointsComparison.map(p => `
<div class="flex items-start gap-2 py-1">
<span>${p.studentHit==='命中'?'✅':'❌'}</span>
<div><p class="font-medium">${p.pointDescription} (${p.maxPointScore}分)</p>
<p class="text-sm text-gray-600">${p.comment}</p></div>
</div>
`).join('')}
</div>
${result.suggestions ? `<div class="bg-blue-50 p-3 rounded">💡 ${result.suggestions}</div>` : ''}
</div>
`;
document.getElementById('resultPanel').innerHTML = html;
}
八、部署说明
8.1 单文件直接运行
- 将完整HTML文件保存至本地。
- 用Chrome/Edge打开。
- 点击右上角设置图标，配置以下项：
- 选择 AI Provider（DeepSeek / OpenAI / 通义千问 / 月之暗面 / 智谱 GLM）
- 输入对应 Provider 的 API Key
- 调整出题难度和随机性（可选）
- 选择学科，点击“生成题目”，等待数秒即可开始训练。
- 切换学科时，之前的题目和答案自动保留，不会丢失。
8.2 通过静态服务器分发
# 使用任意HTTP服务器，如Python
python -m http.server 8000
# 访问 http://localhost:8000/法考主观题模拟训练.html
8.3 安全增强（可选后期升级）
- 部署一个简易BFF（Vercel Functions/Netlify Functions），将API Key设为环境变量，前端不再暴露密钥。
- 路由：
/api/generate、/api/grade分别代理所选 Provider 的 API。 - Provider 配置移至后端，前端仅传入 provider 标识，由后端决定 baseURL 和 model。
九、测试验证
| 测试用例 | 预期结果 |
|---|---|
| 1. 无API Key点击“生成题目” | 弹出设置对话框，提示输入Key |
| 2. 输入有效Key后生成刑法题 | 约10秒后题目加载，显示案情和指定数量问题 |
| 3. 空白答案提交 | 提示“请先输入答案” |
| 4. 正常答案提交评分 | 约8秒后显示总分、维度分、采分点对比 |
| 5. 切换学科后保留旧题 | 切换到其他学科后切回，原题目和答案完整保留 |
| 6. 非法JSON返回 | 提示“AI出题异常，请重试”，可触发重试 |
| 7. 切换AI Provider | 设置中切换Provider并填入对应API Key后，能正常出题和评分 |
| 8. 调整难度等级 | 分别设为简单/中等/困难，生成的题目复杂度有明显差异 |
| 9. 调整随机性滑块 | 设为1和10时，连续两次生成的题目变化幅度显著不同 |
| 10. 清空当前学科数据 | 点击“清空当前学科”，该学科的题目和答案被清除，其他学科不受影响 |
十、后续迭代方向
| 序号 | 功能 | 价值 |
|---|---|---|
| 1 | 自定义 Provider 配置（允许用户手动输入 baseURL / model） | 兼容更多私有化部署或国内第三方 API 服务 |
| 2 | 富文本编辑器（支持法条标注） | 提升答题体验 |
| 3 | 计时器模拟考试 | 全真机考氛围 |
| 4 | 错题本（IndexedDB存储） | 记录每次练习，追踪进步 |
| 5 | 多题整套模考（一键生成“4+1”完整卷） | 系统性训练 |
| 6 | 知识图谱可视化 | 展示弱项考点 |
| 7 | 语音输入答案 | 便捷性提升 |
文档结束。开发者可参照此文档，结合前序对话中的命题规则、知识体系和评分设计，直接构建可工作的HTML应用。所有AI交互的Prompt模板已提前设计完毕，只需在前端代码中正确封装与调用即可。
