# DesignerCEP 部署架构说明

## 📐 整体架构

```
┌─────────────────────────────────────────────────────────────┐
│                         用户设备                              │
│  ┌────────────────────────────────────────────────────────┐ │
│  │          Adobe Photoshop + CEP 扩展                     │ │
│  │  ┌──────────────────────────────────────────────────┐  │ │
│  │  │  1. Shell (本地 CEP)                              │  │ │
│  │  │     - 首次从服务器下载 shell.zip                  │  │ │
│  │  │     - 离线登录页 (file://)                       │  │ │
│  │  │     - 版本管理和更新                              │  │ │
│  │  └──────────────────────────────────────────────────┘  │ │
│  │                          ▼                               │ │
│  │  ┌──────────────────────────────────────────────────┐  │ │
│  │  │  2. Core (在线应用)                               │  │ │
│  │  │     - 从服务器加载 (https://)                     │  │ │
│  │  │     - 核心功能和业务逻辑                          │  │ │
│  │  │     - 与 Photoshop 交互                          │  │ │
│  │  └──────────────────────────────────────────────────┘  │ │
│  └────────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼ HTTP/HTTPS
┌─────────────────────────────────────────────────────────────┐
│                      服务器 (Linux)                           │
│  ┌────────────────────────────────────────────────────────┐ │
│  │                    Nginx (反向代理)                     │ │
│  │  ┌──────────────┬──────────────┬──────────────────┐   │ │
│  │  │ /shell/      │ /core/       │ /api/            │   │ │
│  │  │ Shell 在线页 │ Core 应用    │ API 接口         │   │ │
│  │  └──────┬───────┴──────┬───────┴────────┬─────────┘   │ │
│  └─────────┼──────────────┼────────────────┼─────────────┘ │
│            │              │                │               │
│  ┌─────────▼──────────────▼────────────────▼─────────────┐ │
│  │              静态文件服务 + FastAPI                     │ │
│  │  ┌────────────┐  ┌────────────┐  ┌─────────────┐    │ │
│  │  │   Shell    │  │    Core    │  │  API Routes │    │ │
│  │  │ (在线登录) │  │  (核心应用) │  │  (业务逻辑) │    │ │
│  │  └────────────┘  └────────────┘  └─────────────┘    │ │
│  └────────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
```

## 🔄 用户流程

### 场景 1: 首次使用（CEP 扩展）

```
1. 用户安装 CEP 扩展
   └─> 扩展启动，检查本地是否有 Shell

2. 如果没有 Shell，从服务器下载
   └─> 下载 /downloads/shell-1.0.0.zip
   └─> 解压到本地缓存目录

3. 加载本地 Shell 登录页 (file://)
   └─> 用户输入用户名密码

4. 登录成功后
   └─> 检查版本更新
   └─> 下载 Core 应用到本地缓存
   └─> 加载 Core 应用 (http://localhost:8000/core/1.0.0/)
       或直接从服务器加载 (https://your-domain.com/core/1.0.0/)
```

### 场景 2: 在线使用（浏览器访问）

```
1. 用户访问在线登录页
   └─> https://your-domain.com/shell/

2. 输入用户名密码登录

3. 登录成功后跳转到 Core
   └─> https://your-domain.com/core/1.0.0/

4. 使用核心功能
   └─> API 调用 → /api/v1/*

5. 退出登录
   └─> 清除本地 token
   └─> 跳转回 Shell 登录页
       https://your-domain.com/shell/#/login
```

## 📁 服务器目录结构详解

```
/var/www/DesignerCEP/Server/
│
├── app/                          # 后端应用代码
│   ├── api/                      # API 路由
│   │   └── v1/
│   │       ├── auth.py           # 认证相关
│   │       ├── client.py         # 客户端相关
│   │       └── ...
│   ├── core/                     # 核心配置
│   ├── services/                 # 业务逻辑
│   └── main.py                   # 应用入口
│
├── static/                       # 静态文件（重要！）
│   │
│   ├── shell/                    # Shell 在线登录页
│   │   ├── index.html            # 登录页入口
│   │   ├── assets/               # JS/CSS/图片等
│   │   │   ├── index-abc123.js
│   │   │   ├── index-xyz456.css
│   │   │   └── logo.png
│   │   └── ...
│   │
│   ├── downloads/                # 下载文件（供 CEP 扩展）
│   │   ├── shell-1.0.0.zip      # Shell 安装包
│   │   ├── shell-1.0.1.zip
│   │   └── ...
│   │
│   └── core/                     # Core 核心应用
│       ├── 1.0.0/                # 版本 1.0.0
│       │   ├── index.html
│       │   ├── assets/
│       │   └── ...
│       ├── 1.0.1/                # 版本 1.0.1
│       │   ├── index.html
│       │   ├── assets/
│       │   └── ...
│       └── ...
│
├── logs/                         # 日志文件
│   ├── access.log
│   └── error.log
│
├── .env                          # 环境变量配置
├── requirements.txt              # Python 依赖
└── venv/                         # Python 虚拟环境
```

## 🌐 URL 路由映射

| URL 路径 | 本地文件路径 | 说明 | 访问方式 |
|---------|------------|------|---------|
| `/shell/` | `static/shell/index.html` | Shell 在线登录页 | 浏览器/CEP |
| `/shell/assets/xxx.js` | `static/shell/assets/xxx.js` | Shell 静态资源 | 自动加载 |
| `/downloads/shell-1.0.0.zip` | `static/downloads/shell-1.0.0.zip` | Shell 安装包 | CEP 下载 |
| `/core/1.0.0/` | `static/core/1.0.0/index.html` | Core 应用（版本 1.0.0） | 浏览器/CEP |
| `/core/1.0.0/assets/xxx.js` | `static/core/1.0.0/assets/xxx.js` | Core 静态资源 | 自动加载 |
| `/api/v1/client/login` | FastAPI 路由 | 登录接口 | API 调用 |
| `/api/v1/client/check_update` | FastAPI 路由 | 检查更新 | API 调用 |

## 🔐 认证流程详解

### 1. 用户登录

```
用户 → Shell 登录页
       ↓
    输入用户名/密码
       ↓
    POST /api/v1/client/login
       ↓
    ┌─────────────────────┐
    │  后端验证           │
    │  - 检查用户名密码   │
    │  - 检查设备限制     │
    │  - 生成 JWT Token   │
    └─────────────────────┘
       ↓
    返回 token + 用户信息
       ↓
    保存到 localStorage:
    - token
    - username
    - device_id
    - auto_login
       ↓
    跳转到 Core 应用
    (/core/1.0.0/#/home?token=xxx&username=xxx&device_id=xxx)
```

### 2. Core 应用初始化

```
Core 启动
  ↓
检查 URL 参数或 localStorage 中的 token
  ↓
如果有 token:
  ├─> 保存到 localStorage
  ├─> 启动心跳检测 (每 60 秒验证一次)
  └─> 加载用户数据
  
如果没有 token:
  └─> 跳转到 Shell 登录页
```

### 3. 退出登录

```
用户点击退出
  ↓
POST /api/v1/auth/logout
  ↓
清除 localStorage:
  - token
  - username
  - device_id
  - auto_login
  ↓
判断环境:
  - CEP 环境 → 跳转到本地 Shell (file://)
  - 浏览器环境 → 跳转到在线 Shell (https://)
```

## 🔄 版本更新流程

### 方案 1: 服务器端更新（推荐）

```
1. 构建新版本
   cd Designer
   npm run build
   
2. 上传到服务器
   scp -r dist/Designer/* \
     user@server:/var/www/DesignerCEP/Server/static/core/1.0.1/
   
3. 更新后端配置
   修改 current_version = "1.0.1"
   
4. 用户下次登录时自动获取新版本
```

### 方案 2: CEP 扩展自动更新

```
1. 用户启动 CEP 扩展

2. Shell 调用 /api/v1/client/check_update
   返回: { version: "1.0.1", download_url: "/core/1.0.1.zip" }

3. 如果版本号不同，自动下载新版本

4. 下载并解压到本地缓存

5. 启动新版本 Core
```

## 🔒 安全考虑

### 1. 数据传输

- ✅ 必须使用 HTTPS（SSL 证书）
- ✅ API 请求必须携带 JWT Token
- ✅ Token 过期时间设置合理（默认 30 天）

### 2. 跨域处理

```python
# 后端配置 CORS
ALLOWED_ORIGINS = [
    "https://your-domain.com",
    "https://www.your-domain.com",
    "file://",  # 允许 CEP 扩展访问
]
```

### 3. 文件访问权限

```bash
# 静态文件目录权限
chmod 755 static/
chmod 644 static/shell/*
chmod 644 static/core/*

# 配置文件权限
chmod 600 .env
```

## 📊 性能优化

### 1. 静态资源缓存

```nginx
# Nginx 配置
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
    expires 1y;
    add_header Cache-Control "public, immutable";
}

location ~* \.html$ {
    expires -1;
    add_header Cache-Control "no-cache";
}
```

### 2. 资源压缩

```nginx
# 启用 Gzip 压缩
gzip on;
gzip_types text/plain text/css application/json application/javascript;
```

### 3. CDN 加速（可选）

将静态资源部署到 CDN，加快全球访问速度。

## 🔍 监控和日志

### 1. 应用日志

- 后端日志: `/var/www/DesignerCEP/Server/logs/`
- Nginx 日志: `/var/log/nginx/`
- Systemd 日志: `journalctl -u designer-cep`

### 2. 监控指标

- 服务器 CPU/内存使用率
- API 响应时间
- 在线用户数
- 错误率和异常追踪

---

**总结**:

这个架构支持两种使用方式：
1. **CEP 扩展模式**：Shell 在本地，Core 可在本地或服务器
2. **纯在线模式**：Shell 和 Core 都在服务器，通过浏览器访问

无论哪种方式，用户退出登录后都能回到 Shell 登录页重新登录。

