AIGC/demo/EMAIL_VERIFICATION_LOGIN_GUIDE.md

# 邮箱验证码登录系统说明

## 📋 系统说明

系统**已完全禁用用户名密码登录**，现在**仅支持邮箱验证码登录**。

## 🔐 登录流程

### 1. 用户登录流程

```
输入邮箱 → 点击"获取验证码" → 接收邮件验证码 → 输入验证码 → 点击"登录/注册" → 进入系统
```

### 2. 详细步骤

1. **输入邮箱地址**
   - 用户在登录页面输入邮箱地址
   - 系统会验证邮箱格式

2. **获取验证码**
   - 点击"获取验证码"按钮
   - 系统调用腾讯云SES发送验证码邮件
   - 按钮进入60秒倒计时状态（防重复发送）

3. **接收验证码**
   - 用户查收邮箱中的验证码
   - 验证码为6位数字
   - 验证码有效期：5分钟

4. **输入验证码**
   - 用户输入收到的6位数字验证码
   - 系统会验证验证码格式

5. **完成登录**
   - 点击"登录/注册"按钮
   - 系统验证验证码是否正确
   - 验证通过后：
     - 如果用户存在：直接登录
     - 如果用户不存在：自动注册新用户并登录
   - 登录成功后生成JWT Token
   - 跳转到个人主页

## ✅ 已实现的功能

### 后端功能
✅ **邮箱验证码登录接口** - `/api/auth/login/email`
- 验证邮箱验证码
- 自动注册新用户（如不存在）
- 生成JWT Token
- 返回用户信息

✅ **用户名密码登录已禁用** - `/api/auth/login`
- 返回提示信息："系统已禁用用户名密码登录，请使用邮箱验证码登录"

✅ **验证码服务**
- 发送验证码邮件：`/api/verification/email/send`
- 验证验证码：`/api/verification/email/verify`
- 开发模式支持：`/api/verification/email/dev-set`

### 前端功能
✅ **登录页面**
- 邮箱输入框
- 验证码输入框
- 获取验证码按钮（带倒计时）
- 登录/注册按钮
- 表单验证
- 错误提示

✅ **登录流程**
- 发送验证码请求
- 验证码格式验证（6位数字）
- 调用邮箱验证码登录API
- Token存储
- 自动跳转

## 📝 API接口说明

### 1. 发送验证码
```
POST /api/verification/email/send
Content-Type: application/json

{
  "email": "user@example.com"
}
```

**响应**：
```json
{
  "success": true,
  "message": "验证码发送成功"
}
```

### 2. 邮箱验证码登录
```
POST /api/auth/login/email
Content-Type: application/json

{
  "email": "user@example.com",
  "code": "123456"
}
```

**响应**：
```json
{
  "success": true,
  "message": "登录成功",
  "data": {
    "user": {
      "id": 1,
      "username": "user",
      "email": "user@example.com",
      ...
    },
    "token": "eyJhbGciOiJIUzI1NiIs..."
  }
}
```

## 🔒 安全特性

### 1. 验证码安全
- ✅ 验证码有效期：5分钟
- ✅ 验证码长度：6位数字
- ✅ 发送频率限制：60秒内只能发送一次
- ✅ 验证后自动删除，防止重复使用

### 2. 登录安全
- ✅ 必须验证验证码才能登录
- ✅ 用户名密码登录已完全禁用
- ✅ 使用JWT Token进行身份认证
- ✅ 自动注册用户时设置默认权限（ROLE_USER）

## 🎯 用户体验

### 优点
- ✅ 无需记忆密码
- ✅ 登录流程简单
- ✅ 自动注册新用户
- ✅ 安全可靠

### 注意事项
- ⚠️ 需要邮箱能够正常接收邮件
- ⚠️ 验证码有时效性（5分钟）
- ⚠️ 发送验证码有频率限制（60秒）

## 🛠️ 开发模式

### 开发环境配置
当 `tencent.ses.template-id=0` 时，系统进入开发模式：

- ✅ 不会实际发送邮件
- ✅ 验证码显示在日志中
- ✅ 可以使用开发接口手动设置验证码

### 开发模式测试
```bash
# 1. 发送验证码（开发模式）
POST /api/verification/email/send
{
  "email": "test@example.com"
}
# 查看日志获取验证码

# 2. 或者直接设置验证码
POST /api/verification/email/dev-set
{
  "email": "test@example.com",
  "code": "123456"
}

# 3. 使用设置的验证码登录
POST /api/auth/login/email
{
  "email": "test@example.com",
  "code": "123456"
}
```

## 📊 登录流程对比

### 旧流程（已禁用）
```
输入用户名 → 输入密码 → 点击登录 → 进入系统
```

### 新流程（当前）
```
输入邮箱 → 获取验证码 → 接收邮件 → 输入验证码 → 登录/注册 → 进入系统
```

## ⚙️ 配置要求

### 必需配置
```properties
# 腾讯云SES配置
tencent.ses.secret-id=你的SecretID
tencent.ses.secret-key=你的SecretKey
tencent.ses.from-email=已验证的发信地址
tencent.ses.template-id=0  # 0=开发模式，实际ID=生产模式
```

## 🚀 使用示例

### 前端调用示例

```javascript
// 1. 发送验证码
const response = await fetch('/api/verification/email/send', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ email: 'user@example.com' })
})

// 2. 登录（使用收到的验证码）
const loginResponse = await fetch('/api/auth/login/email', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    email: 'user@example.com',
    code: '123456'  // 从邮箱获取的验证码
  })
})

const result = await loginResponse.json()
if (result.success) {
  // 保存token和用户信息
  sessionStorage.setItem('token', result.data.token)
  sessionStorage.setItem('user', JSON.stringify(result.data.user))
  // 跳转到主页
}
```

## ⚠️ 重要说明

1. **用户名密码登录已完全禁用**
   - 即使调用 `/api/auth/login`，也会返回错误提示
   - 所有登录必须通过邮箱验证码方式

2. **自动注册**
   - 如果邮箱对应的用户不存在，系统会自动创建新用户
   - 用户名自动从邮箱生成（邮箱@前面的部分）
   - 默认角色：ROLE_USER（普通用户）
   - 默认积分：50

3. **验证码管理**
   - 验证码存储在内存中（重启服务会清除）
   - 验证成功后自动删除
   - 过期后自动清除

## 🔄 后续优化建议

如需进一步提升，可以考虑：
- 将验证码存储到Redis（支持分布式）
- 添加图形验证码防止机器人
- 支持手机号验证码登录
- 添加登录日志记录

## ✅ 总结

系统现在**完全使用邮箱验证码登录**，用户名密码登录已禁用。用户只需：
1. 输入邮箱
2. 获取验证码
3. 输入验证码
4. 完成登录/注册

安全和用户体验都得到了提升！