1. 页面概览
「登录」是 AI 行动平台的统一认证入口(对应前端源码 action/web/src/views/LoginPage.vue)。用户用用户名 + 密码登录后,前端把 JWT token 存入 localStorage 的 aip_token,即可访问各产品受保护路由;同时支持注册模式,输入用户名、密码(可选邮箱)即可创建账号,注册成功后自动切回登录模式。一句话总结:本页是平台唯一登录/注册入口,登录成功即获得全平台访问令牌。
2. 访问入口
2.1 路由与菜单
路由 path: /login、name: Login、meta 标题「登录」且 guest: true(公开路由);未登录访问受保护页面时,路由守卫重定向到 /login?redirect=<原路径>,登录后自动跳回。本页无侧边栏菜单,未登录时顶部导航栏不渲染。
2.2 认证与权限
公开页无需 token;已登录(localStorage 有 aip_token)再访问 /login 会被守卫直接跳到 Foundry。登录成功后 token 类型为 JWT(Bearer),存 localStorage['aip_token'],用户名存 localStorage['aip_username']。
2.3 端口与 API 前缀
AIP 后端 18080;客户端 action/web/src/api/client.js,baseURL /api/v1(开发态由 Vite 代理分流到 18080)。
3. 界面布局
居中卡片式,从上到下依次为标题区、提示条、表单区、模式切换区:
┌──────────────────────────────┐
│ AI 行动平台 │
│ 请使用您的账号登录 / 创建一个新账号 │
│ [操作提示条 alert] │
│ 用户名 [________________] │
│ 密码 [________________] │
│ 邮箱(选填,仅注册模式)[____] │
│ [ 登录 / 注册 ] │
│ 还没有账号? [立即注册] │
└──────────────────────────────┘
- 标题区:品牌名「AI 行动平台」+ 副标题随模式切换(「请使用您的账号登录」/「创建一个新账号」)。
- 表单区:用户名、密码必填;注册模式多一个邮箱(选填)输入框。
- 提交区:整行主按钮(
btn-primary btn-block)。 - 底部:登录/注册模式互切链接。
4. 交互元素
| 控件 | 位置 | 含义与作用 |
|---|---|---|
| 输入框「用户名」 | 表单 | 登录/注册用户名,必填 |
| 输入框「密码」 | 表单 | 登录/注册密码,必填(type=password) |
| 输入框「邮箱(选填)」 | 表单(仅注册模式) | 注册时可填邮箱 |
| 按钮「登录」/「注册」 | 表单底部 | 提交表单;loading 时文案变「处理中...」并禁用 |
| 链接「立即注册」/「立即登录」 | 表单底部 | toggleMode() 切换模式并清空表单与提示 |
次要控件:表单上方 alert 提示条展示成功/失败消息(如「登录成功!」「操作失败:<详情>」)。
5. 后端关联
5.1 API 客户端
action/web/src/api/client.js:axios baseURL /api/v1,timeout 30s;请求拦截器附 Bearer aip_token;401 时清除 token 并跳 /login。
5.2 端点表
| 方法 | 路径 | 请求体 | 页面触发点 | 成功响应 |
|---|---|---|---|---|
| POST | /auth/login | {username, password} | 登录模式提交 | {user_id, username, token, token_type:"bearer"} |
| POST | /auth/register | {username, password, email?} | 注册模式提交 | 201 {user_id, username} |
5.3 关键机制
doLogin 兼容两种后端响应——AIP(18080) 返回顶层 {token, username},Foundry(18081) 返回 {code:0, data:{...}} 信封,前端先判断 data.data.token 是否存在再取内层,随后落库 aip_token/aip_username;Gotham 后端返回 refresh_token 时同步存入 gotham_refresh_token(供 401 自动重放)。登录成功后读 route.query.redirect 决定落地页(默认 /foundry);注册成功后自动切回登录模式。
6. 权限与安全
- 登录/注册接口为公开路由(
api组,无鉴权中间件)。 - 账号密码校验由后端 authService 完成(登录失败返回 401/403 语义错误,前端提示「操作失败:<error>」)。
- Token 存浏览器 localStorage,后续请求由各客户端拦截器统一以
Authorization: Bearer <aip_token>附带。
7. 常见问题与排错
- 登录成功却立刻跳回登录页:原因是后端 401(token 无效),client.js 拦截器清除 token 并重定向。处理:重新登录;检查服务器时钟与 SECRET_KEY 是否稳定;频繁 401 看后端日志。
- 提示「操作失败:invalid request body」:原因是请求体字段缺失或格式不符(如密码为空、Content-Type 错误)。处理:确认用户名密码均已填写;用 curl 直接调
POST /api/v1/auth/login复现。 - 注册成功但无法登录:原因是注册接口只创建账号不返回 token,需切登录模式再登录。处理:按提示「请切换到登录模式登录」切换;若仍失败检查用户名是否已存在。
- 访问 /login 被直接跳到 Foundry:原因是 localStorage 已有
aip_token,guest 页对已登录用户重定向。处理:属预期行为;如需换账号先在顶部导航栏登出(清 token)。
8. 已知缺陷与边界
- 前端对后端响应做「双信封兼容」判断(
data.data.token),后端结构再变化时需同步调整。 - 本页为全产品共用登录页:登录后默认落地 Foundry;Apollo 有独立登录页
/apollo/login(apollo_token),不走本页。 - 邮箱为选填,暂无邮箱找回密码等流程。