# JS加密平台 - 项目开发文档

## 一、技术选型

| 层 | 技术 | 版本 | 说明 |
|---|------|------|------|
| Web服务器 | Nginx | 1.30.2 | 已安装 |
| 后端语言 | PHP | 8.4.21 | 已安装，使用原生PHP无框架 |
| 数据库 | MySQL | 5.7.43 | 已安装 |
| 混淆引擎 | Node.js (javascript-obfuscator) | 22.22.3 | 已安装，PHP通过exec调用 |
| 前端编辑器 | CodeMirror 6 | CDN | JS代码高亮编辑 |
| 前端UI框架 | Arco Design CSS | 2.x CDN | 字节跳动出品，设计精美 |
| 前端响应式 | Alpine.js | 3.x CDN | 极简响应式框架，纯H5无构建 |
| HTTP请求 | Axios | CDN | AJAX请求 |
| 图片生成 | Trae API text_to_image | - | Logo/插图生成 |

### PHP版本选择理由

选择 **PHP 8.4**（服务器已安装）：
- 原生类型声明（typed properties）、match表达式、命名参数
- JIT编译器提升性能
- `enum`支持（8.1+）
- `str_contains`、`str_starts_with`等实用函数
- 更好的错误处理和Fiber协程

不使用框架的原因：项目规模适中，原生PHP可减少依赖，部署简单。

### 前端架构选择理由

选择 **Alpine.js + Arco Design CSS** 纯H5方案：

- **Alpine.js**（~15KB gzip）：在HTML标签上直接绑定 `x-data`、`x-on`、`x-show` 等指令，无需虚拟DOM和构建工具。比Vue/React更适合这种单页工具型项目。
- **Arco Design**：字节跳动开源的企业级设计系统，CSS变量驱动，通过CDN内联引入即可使用全部组件样式（按钮、表单、标签、模态框、通知等），视觉质量远超Bootstrap。
- **无构建步骤**：全部通过CDN加载，零配置，直接写HTML就能跑。PHP直接输出页面，无需前后端分离。

---

## 二、系统架构

```
┌──────────────────────────────────────────────────────┐
│               用户浏览器 (纯H5 SPA)                     │
│  ┌────────────────────────────────────────────────┐  │
│  │     Alpine.js 响应式状态管理                     │  │
│  │  ┌───────────┐ ┌──────────┐ ┌───────────────┐ │  │
│  │  │ 代码编辑器  │ │ 配置面板  │ │ 结果预览/下载  │ │  │
│  │  │(CodeMirror)│ │(Arco表单)│ │(Arco Card)    │ │  │
│  │  └───────────┘ └──────────┘ └───────────────┘ │  │
│  │          Arco Design CSS 设计系统              │  │
│  └────────────────────────────────────────────────┘  │
│       │              │ AJAX(Axios)     │              │
└───────┼──────────────┼─────────────────┼──────────────┘
        │              │                  │
        ▼              ▼                  ▼
┌──────────────────────────────────────────────────────┐
│                   Nginx (80/443)                      │
│           静态资源(assets/) | PHP-FPM                 │
└──────────────────────┬───────────────────────────────┘
                       │
                       ▼
┌──────────────────────────────────────────────────────┐
│                 PHP 8.4 后端层                         │
│                                                       │
│  ┌──────────┐  ┌──────────┐  ┌──────────────────┐   │
│  │ 路由分发  │  │ 用户系统  │  │ API控制器         │   │
│  │index.php  │  │auth/     │  │api/obfuscate.php  │   │
│  └──────────┘  └──────────┘  └────────┬─────────┘   │
│                                        │              │
│                          ┌─────────────┴──────────┐  │
│                          │ PHP exec() 调用         │  │
│                          │ node obfuscator/cli.js  │  │
│                          └─────────────┬──────────┘  │
│                                        │              │
│                          ┌─────────────┴──────────┐  │
│                          │ Node.js 混淆引擎        │  │
│                          │ (javascript-obfuscator) │  │
│                          └────────────────────────┘  │
│                                                       │
│  ┌──────────────────────────────────────────────┐    │
│  │              MySQL 5.7 数据库                  │    │
│  │  users | obfuscations | settings | api_logs   │    │
│  └──────────────────────────────────────────────┘    │
└──────────────────────────────────────────────────────┘
```

### 核心处理流程

```
用户粘贴JS代码 → 选择配置参数 → 点击加密
    ↓
PHP接收请求 → 参数验证 → 写入临时文件
    ↓
PHP exec('node cli.js --input tmp.js --output out.js --config {...}')
    ↓
Node.js用javascript-obfuscator处理AST混淆
    ↓
PHP读取输出文件 → 存入数据库(历史记录) → 返回结果给前端
    ↓
前端展示混淆后代码，支持复制/下载
```

---

## 三、功能模块

### 3.1 功能全景

| 模块 | 功能 | 是否VIP |
|------|------|---------|
| 在线加密 | 粘贴代码在线混淆加密 | 免费 |
| 文件加密 | 上传JS文件批量加密 | VIP |
| 一键配置 | 预设低/中/高三种强度 | 免费 |
| 自定义配置 | 逐项调整混淆参数 | 免费 |
| 结果下载 | 下载混淆后的JS文件 | 免费 |
| 历史记录 | 查看历史混淆记录 | 注册用户 |
| 用户系统 | 注册/登录/个人中心 | 免费 |
| VIP系统 | 付费解锁大文件/批量 | 付费 |

### 3.2 混淆配置参数（对标jsjiami）

**基础配置：**
- `compact`：压缩成一行（默认true）
- `selfDefending`：自防御/防止格式化
- `deadCodeInjection`：花指令/死代码注入
- `deadCodeInjectionThreshold`：花指令注入系数(0-1)

**标识符配置：**
- `identifierNamesGenerator`：变量名规则(`hexadecimal`/_0x / `mangled`/短名 / `dictionary`/ilI1)
- `renameGlobals`：是否重命名全局变量和函数
- `identifiersPrefix`：变量名前缀

**字符串配置：**
- `stringArray`：字符串数组化
- `stringArrayEncoding`：字符串编码(`none`/`base64`/`rc4`)
- `stringArrayThreshold`：字符串处理比例(0-1)
- `splitStrings`：拆分字符串
- `stringArrayRotate/shuffle`：数组随机打乱

**控制流配置：**
- `controlFlowFlattening`：控制流平坦化
- `controlFlowFlatteningThreshold`：平坦化系数(0-1)

**其他配置：**
- `debugProtection`：禁止控制台调试
- `debugProtectionInterval`：调试检测间隔(毫秒)
- `disableConsoleOutput`：禁止控制台输出
- `domainLock`：安全域名锁定
- `numbersToExpressions`：数字转表达式
- `transformObjectKeys`：对象键名混淆
- `unicodeEscapeSequence`：Unicode转义
- `reservedStrings`：保留字符串
- `reservedNames`：保留变量名

### 3.3 一键配置预设

| 预设 | compact | CF flattening | deadCode | stringArray | debugProtect | selfDefend |
|------|---------|---------------|----------|-------------|--------------|------------|
| 低强度 | true | false | false | true(base64) | false | false |
| 中强度 | true | 0.5 | 0.4 | true(rc4) | true | true |
| 高强度 | true | 1.0 | 1.0 | true(rc4) | true(4000ms) | true |

---

## 四、数据库设计

### 4.1 ER图

```
┌──────────┐       ┌──────────────────┐       ┌──────────┐
│  users   │ 1───N │  obfuscations    │       │  configs │
│          │       │                  │       │          │
│ id (PK)  │       │ id (PK)          │       │ id (PK)  │
│ username │       │ user_id (FK)     │       │ user_id  │
│ email    │       │ original_size    │       │ name     │
│ password │       │ obfuscated_size  │       │ settings │
│ is_vip   │       │ config_json      │       │ is_default│
│ vip_exp  │       │ original_code    │       └──────────┘
│ created  │       │ obfuscated_code  │
│ balance  │       │ created_at       │
└──────────┘       └──────────────────┘
```

### 4.2 建表SQL

```sql
-- 用户表
CREATE TABLE `users` (
  `id` INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,
  `username` VARCHAR(50) NOT NULL UNIQUE,
  `email` VARCHAR(100) NOT NULL UNIQUE,
  `password` VARCHAR(255) NOT NULL,
  `is_vip` TINYINT(1) NOT NULL DEFAULT 0,
  `vip_expire_at` DATETIME NULL,
  `balance` DECIMAL(10,2) NOT NULL DEFAULT 0.00,
  `created_at` DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  `updated_at` DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

-- 混淆历史记录表
CREATE TABLE `obfuscations` (
  `id` INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,
  `user_id` INT UNSIGNED NULL,
  `original_size` INT UNSIGNED NOT NULL DEFAULT 0 COMMENT '原始代码字节数',
  `obfuscated_size` INT UNSIGNED NOT NULL DEFAULT 0 COMMENT '混淆后字节数',
  `config_json` TEXT NULL COMMENT '使用的配置JSON',
  `original_code` MEDIUMTEXT NOT NULL COMMENT '原始代码',
  `obfuscated_code` MEDIUMTEXT NOT NULL COMMENT '混淆后代码',
  `ip_address` VARCHAR(45) NULL,
  `created_at` DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  KEY `idx_user_id` (`user_id`),
  KEY `idx_created_at` (`created_at`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

-- 用户配置模板表
CREATE TABLE `user_configs` (
  `id` INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,
  `user_id` INT UNSIGNED NOT NULL,
  `name` VARCHAR(100) NOT NULL,
  `settings` TEXT NOT NULL COMMENT 'JSON格式配置',
  `is_default` TINYINT(1) NOT NULL DEFAULT 0,
  `created_at` DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  KEY `idx_user_id` (`user_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

-- API调用日志
CREATE TABLE `api_logs` (
  `id` INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,
  `user_id` INT UNSIGNED NULL,
  `action` VARCHAR(50) NOT NULL COMMENT 'obfuscate/login/register',
  `ip_address` VARCHAR(45) NULL,
  `user_agent` VARCHAR(500) NULL,
  `details` TEXT NULL,
  `created_at` DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
  KEY `idx_action` (`action`),
  KEY `idx_created_at` (`created_at`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
```

---

## 五、API设计

| 方法 | 路径 | 说明 | 认证 |
|------|------|------|------|
| POST | `/api/obfuscate.php` | 执行混淆加密 | 否(限频) |
| POST | `/api/register.php` | 用户注册 | 否 |
| POST | `/api/login.php` | 用户登录 | 否 |
| GET | `/api/user/info.php` | 获取用户信息 | Token |
| GET | `/api/history.php` | 获取混淆历史 | Token |
| GET | `/api/history/detail.php?id=` | 查看历史详情 | Token |
| DELETE | `/api/history/delete.php?id=` | 删除历史记录 | Token |
| POST | `/api/config/save.php` | 保存配置模板 | Token |

### 混淆API详情

**请求：**
```json
POST /api/obfuscate.php
{
    "code": "(function(){console.log('hello')})();",
    "config": {
        "preset": "high",
        "compact": true,
        "controlFlowFlattening": true,
        "controlFlowFlatteningThreshold": 0.75,
        "deadCodeInjection": true,
        "deadCodeInjectionThreshold": 0.4,
        "stringArray": true,
        "stringArrayEncoding": "rc4",
        "stringArrayThreshold": 0.75,
        "identifierNamesGenerator": "hexadecimal",
        "selfDefending": true,
        "debugProtection": true,
        "debugProtectionInterval": 2000,
        "disableConsoleOutput": true,
        "domainLock": [],
        "reservedStrings": [],
        "reservedNames": []
    }
}
```

**响应：**
```json
{
    "success": true,
    "data": {
        "obfuscated_code": "var _0x...",
        "original_size": 42,
        "obfuscated_size": 2048,
        "hash": "a1b2c3d4"
    }
}
```

---

## 六、目录结构

```
/www/wwwroot/jscx.25y.cn/
├── index.php                    # 首页/单页应用入口
├── .htaccess                    # Nginx重写规则（已存在）
│
├── api/                         # API接口
│   ├── obfuscate.php           # 混淆加密接口
│   ├── register.php            # 注册
│   ├── login.php               # 登录
│   ├── user/
│   │   └── info.php            # 用户信息
│   ├── history.php             # 历史记录列表
│   ├── history_detail.php      # 历史记录详情
│   └── config_save.php         # 保存配置
│
├── includes/                    # PHP公共模块
│   ├── config.php              # 数据库/系统配置
│   ├── db.php                  # 数据库连接(PDO)
│   ├── auth.php                # 认证中间件(JWT)
│   ├── response.php            # 统一JSON响应
│   ├── validator.php           # 参数验证
│   └── rate_limit.php          # 频率限制
│
├── pages/                       # 独立页面
│   ├── login.html              # 登录页
│   ├── register.html           # 注册页
│   └── history.html            # 历史记录页
│
├── assets/                      # 静态资源
│   ├── css/
│   │   └── style.css           # 全局样式(少量覆盖Arco)
│   ├── js/
│   │   ├── app.js              # Alpine.js主逻辑 + 状态管理
│   │   ├── editor.js           # CodeMirror编辑器初始化
│   │   └── obfuscate.js        # 混淆请求/响应处理
│   └── images/                  # 图片素材(Lazy API生成)
│
├── obfuscator/                  # Node.js混淆引擎
│   ├── package.json
│   ├── cli.js                  # CLI入口(PHP调用)
│   └── presets.js              # 预设配置
│
├── uploads/                     # 上传文件(临时)
├── sql/
│   └── schema.sql              # 数据库建表SQL
│
└── docs/
    └── dev-plan.md             # 本文档
```

---

## 七、安全设计

| 措施 | 实现方式 |
|------|----------|
| SQL注入防护 | PDO预处理语句 |
| XSS防护 | htmlspecialchars输出编码 |
| CSRF防护 | Token验证 |
| 密码存储 | password_hash(p4ss, PASSWORD_BCRYPT) |
| 频率限制 | IP+Session双重限流（免费5次/分钟） |
| 文件上传 | 仅允许.js/.mjs，限制200KB(免费) |
| API认证 | JWT Token，7天过期 |
| 代码隔离 | Node.js沙箱执行，30秒超时 |

---

## 八、开发阶段

| 阶段 | 内容 | 预计产出 |
|------|------|----------|
| Phase 1 | 基础架构搭建 | 目录结构、配置文件、数据库建表 |
| Phase 2 | Node.js混淆引擎 | cli.js + javascript-obfuscator集成 |
| Phase 3 | PHP混淆API | 核心加密接口、参数处理 |
| Phase 4 | 前端编辑器页面 | 代码编辑器、配置面板、结果展示 |
| Phase 5 | 用户系统 | 注册、登录、JWT认证 |
| Phase 6 | 历史记录 | 保存/查看/删除混淆记录 |
| Phase 7 | VIP系统 | 付费逻辑、权限控制 |
| Phase 8 | 测试优化 | 功能测试、性能优化 |