# Google OAuth 前端接入说明

该文档面向前端同学，描述最新的 Google 登录/注册接入方式。

---

## 一、整体流程

```
用户 → Google 授权 → 回到前端回调页
前端回调页读取 code/state → 调用 Python /api/oauth/google
Python 返回 token/user 给前端 → 前端完成登录态落地
```

---

## 二、Google 控制台配置

在 Google Cloud Console → API 与服务 → 凭据 → 选择"Web 应用的客户端 ID"：

### Authorized JavaScript origins（已授权的 JavaScript 来源）
- `https://www.movieflow.net`
- `https://www.movieflow.ai`

### Authorized redirect URIs（已授权的重定向 URI）
- `https://www.movieflow.net/api/auth/google/callback`
- `https://www.movieflow.ai/api/auth/google/callback`

本地调试（可选）：
- JavaScript origins: `http://localhost:3000`
- Redirect URIs: `http://localhost:3000/api/auth/google/callback`

---

## 三、前端调用

### 第一步：Google 授权回调
在前端回调页（`/api/auth/google/callback`）读取 Google 返回的 `code` 与 `state`。

### 第二步：调用 Python 接口
- **路径**：`POST ${NEXT_PUBLIC_SMARTVIDEO_URL}/api/oauth/google`
- **请求体**：
```json
{
  "code": "string",
  "state": "string",
  "invite_code": "string | null"
}
```

- **响应**：
```json
{
  "success": true,
  "data": {
    "token": "string",
    "user": {
      "userId": "string",
      "userName": "string", 
      "name": "string",
      "email": "string",
      "authType": "GOOGLE",
      "avatar": "string",
      "isNewUser": true
    },
    "message": "Google OAuth successful"
  }
}
```

### 前端代码示例
```typescript
const baseUrl = process.env.NEXT_PUBLIC_SMARTVIDEO_URL;
const res = await fetch(`${baseUrl}/api/oauth/google`, {
  method: 'POST',
  headers: { 
    'Content-Type': 'application/json', 
    'Accept': 'application/json' 
  },
  body: JSON.stringify({ code, state, invite_code })
});

const result = await res.json();
if (result.success) {
  const { token, user } = result.data;
  // 持久化 token & user
} else {
  // 统一错误提示 result.message
}
```

---

## 四、环境变量

- `NEXT_PUBLIC_SMARTVIDEO_URL`：后端 Python 服务地址

---

## 五、错误处理

常见错误码：
- `GOOGLE_TOKEN_EXCHANGE_FAILED`：授权码交换失败
- `INVALID_ID_TOKEN`：ID Token 无效  
- `UPSTREAM_AUTH_ERROR`：用户服务异常

前端统一处理：基于 `success=false` 与 `message` 提示用户。

---

## 六、安全建议

- 启用 PKCE
- 在 `state` 中绑定 CSRF 防护信息
- 确保回调地址与发起授权时的 `redirect_uri` 完全一致

---

文档版本：v4.0  
更新时间：2025-09-23  
适用范围：video-flow 前端项目