登录表单
💡 提示
试试用户名
admin，密码 123456
当前步骤：{{ flowStep }} / {{ maxStep }}
（手动推进，避免“自动下一步”误解）
📊 数据流可视化
{{
currentStage === 1 ? '📤' : '✅'
}}
1. 客户端发送登录请求
POST
/api/login
Body:
{
"username": "{{ username }}",
"password": "******"
}
⬇️
{{
currentStage === 2 ? '⚙️' : '✅'
}}
2. 服务器验证身份
查询用户数据库
验证密码哈希
生成{{
mode === 'session' ? 'Session' : 'JWT Token'
}}
⬇️
{{
currentStage === 3 ? '📥' : '✅'
}}
3. 服务器返回认证结果
✅ 登录成功
Response:
{
"status": "success",
"user": {
"id": 123,
"username": "{{ username }}"
}
}
{
"status": "success",
"token": "{{ authResult?.token }}",
"user": {
"id": 123,
"username": "{{ username }}"
}
}
{{ mode === 'session' ? '🍪 Cookie 设置' : '🎫 Token 存储' }}
Set-Cookie: session_id={{ authResult?.sessionId }};
HttpOnly; Secure
localStorage.setItem("token", "{{
authResult?.token
}}")
🔄
4. 后续请求自动携带认证信息
GET
/api/user/profile
Header:
Cookie: session_id={{ authResult?.sessionId }}
Authorization: Bearer {{ authResult?.token }}