flowchart TD
A([🚀 开始]) --> B["1️⃣ 用户打开网站或应用
点击「注册」按钮进入注册页面"]
B --> C[/"2️⃣ 用户填写注册信息
📧 邮箱/手机号 · 👤 用户名 · 🔒 密码"/]
C --> D{"3️⃣ 前端基础校验
格式 · 长度 · 必填"}
D -- "❌ 不通过" --> E["提示错误信息
返回修改"]
E --> C
D -- "✅ 通过" --> F["4️⃣ 前端发送 HTTPS 请求
将注册信息发送到服务器"]
F --> G{"5️⃣ 服务器端校验
重复 · 强度 · 安全策略"}
G -- "❌ 不通过" --> H["返回错误信息
如:邮箱已注册"]
H --> C
G -- "✅ 通过" --> I["6️⃣ 服务器发送验证码
📧 邮件验证码 / 📱 短信验证码"]
I --> J[/"7️⃣ 用户输入验证码"/]
J --> K{"8️⃣ 验证码是否正确?"}
K -- "❌ 错误" --> L["验证失败
请重新输入"]
L --> J
K -- "✅ 正确" --> M["9️⃣ 服务器处理注册
🔐 密码加密哈希(bcrypt)
💾 用户信息存入数据库"]
M --> N["🎉 1️⃣0️⃣ 注册成功
服务器返回成功结果"]
N --> O{"系统选择"}
O -- "选项 A" --> P["🔓 自动登录用户
直接进入系统"]
O -- "选项 B" --> Q["🔑 跳转登录页面
提示用户登录"]
P --> R([🏁 结束])
Q --> R
classDef startEnd fill:#10b981,stroke:#059669,color:#fff,stroke-width:2px,font-weight:bold
classDef process fill:#eff6ff,stroke:#3b82f6,color:#1e40af,stroke-width:2px
classDef decision fill:#fffbeb,stroke:#f59e0b,color:#92400e,stroke-width:2px
classDef ioNode fill:#f5f3ff,stroke:#8b5cf6,color:#5b21b6,stroke-width:2px
classDef errorNode fill:#fef2f2,stroke:#ef4444,color:#dc2626,stroke-width:2px
classDef successNode fill:#f0fdf4,stroke:#22c55e,color:#15803d,stroke-width:2px
class A,R startEnd
class B,F,I,M,P,Q process
class D,G,K,O decision
class C,J ioNode
class E,H,L errorNode
class N successNode