# VNC + 音频 + 输入法 集成测试

这是一个用于测试 RCoder Computer Agent 功能的集成测试页面，支持：
- 🖥️ **VNC 远程桌面** - 可视化访问容器桌面环境
- 🎵 **音频流播放** - 实时播放容器内的音频输出
- ⌨️ **输入法透传** - 使用本地输入法（如中文）输入到远程桌面

## 快速开始

### 1. 启动测试服务

```bash
# 进入测试目录
cd test-page

# 启动 HTTP 服务器（Python 3）
python3 -m http.server 8000
```

### 2. 访问测试页面

在浏览器中打开：
```
http://127.0.0.1:8000/vnc-test.html
```

### 3. 测试前准备

确保 RCoder 服务正在运行：
```bash
# 检查服务状态（默认端口 8087）
curl http://127.0.0.1:8087/health
```

如果服务未运行，请先启动 RCoder：
```bash
make dev-up
```

## 使用指南

### 第一步：创建测试容器

在测试页面的聊天输入框中输入任意消息（如 "hello"），点击"发送聊天消息"。

这会自动创建一个 Computer Agent 容器，包含完整的桌面环境。

### 第二步：测试 VNC 远程桌面

1. 点击页面上的 **"打开 VNC 桌面"** 按钮
2. 在新打开的标签页中，可以看到远程桌面界面
3. 使用鼠标和键盘与远程桌面交互

### 第三步：测试音频流

1. 确保浏览器控制台显示：`[Audio] ✅ OpusDecoder 加载成功`
2. 点击 **"启动音频流"** 按钮
3. 在容器内播放音频（如播放 YouTube 视频）
4. 应该能在本地听到音频输出

### 第四步：测试输入法透传

1. 点击 **"连接 IME 服务"** 按钮
2. 等待连接成功提示：`[IME] WebSocket 已连接`
3. 在输入框中切换到中文输入法（或其他输入法）
4. 输入中文文本
5. 点击 **"发送文本"**
6. 在 VNC 桌面中打开文本编辑器，应该能看到输入的中文

## 界面说明

### 连接配置

**RCoder 代理模式**（推荐使用）:
- **RCoder 服务地址**: 默认 `http://127.0.0.1:8087`
- **User ID**: 测试用户名，如 `user_123`
- **Project ID**: 可选，留空则自动生成

**直接端口模式**（仅开发调试）:
- 需要手动配置容器端口映射
- 一般用户不需要使用此模式

### 控制按钮

| 按钮 | 功能 |
|------|------|
| 打开 VNC 桌面 | 在新标签页打开远程桌面 |
| 启动音频流 | 开始接收和播放容器音频 |
| 停止音频流 | 停止音频播放 |
| 连接 IME 服务 | 建立输入法透传连接 |
| 断开 IME 服务 | 断开输入法连接 |
| 发送聊天消息 | 创建容器或与 Agent 对话 |

## 常见问题

### Q: 提示 "OpusDecoder 加载失败"

**A**: 这是浏览器加载音频解码库失败，不影响 VNC 和输入法功能。

如果需要测试音频功能，请确保：
1. `opus-decoder.min.js` 文件与 `vnc-test.html` 在同一目录
2. 使用 HTTP 服务器访问，不要直接双击 HTML 文件

### Q: IME 连接失败

**A**: 可能的原因：
1. **容器未创建** - 先发送聊天消息创建容器
2. **Project ID 错误** - 确保使用正确的 Project ID
3. **服务未启动** - 检查 RCoder 服务是否正常运行

解决方法：
```bash
# 查看容器列表（Computer Agent 容器前缀为 computer-agent-runner-）
docker ps | grep computer-agent-runner

# 查看服务日志
make dev-logs
```

### Q: VNC 桌面显示空白或连接失败

**A**: 可能的原因：
1. 容器正在启动中 - 等待 10-20 秒后重试
2. User ID 或 Project ID 不匹配 - 检查配置是否正确
3. VNC 服务未启动 - 查看容器日志确认服务状态

解决方法：
```bash
# 查看容器日志
docker logs <container_id>

# 重启容器
docker restart <container_id>
```

### Q: 音频有延迟或卡顿

**A**: 这是正常现象，原因：
1. 音频需要编码传输（容器 → 浏览器）
2. 网络延迟影响播放实时性
3. Opus 编解码需要时间

正常延迟在 1-3 秒范围内是可接受的。

### Q: 输入法输入的文本显示乱码

**A**: 可能的原因：
1. 字符编码问题 - 确保使用 UTF-8 编码
2. 容器内字体缺失 - 容器默认包含中文字体

## 技术支持

如果遇到其他问题：

1. **查看浏览器控制台** (F12)
   - 查看错误信息和警告
   - 截图错误信息便于定位问题

2. **查看容器状态**
   ```bash
   docker ps -a | grep computer-agent-runner
   docker logs <container_id>
   ```

3. **查看服务日志**
   ```bash
   make dev-logs
   ```

4. **联系开发团队**
   - 提供详细的错误信息和操作步骤
   - 附上浏览器控制台截图
   - 说明使用的操作系统和浏览器版本

## 系统要求

### 浏览器要求

| 浏览器 | 最低版本 | 说明 |
|--------|---------|------|
| Chrome | 90+ | 推荐使用 |
| Firefox | 88+ | 完全支持 |
| Safari | 14+ | macOS / iOS |
| Edge | 90+ | 完全支持 |

**注意**: 不支持 Internet Explorer

### 网络要求

- 浏览器能访问 `http://127.0.0.1:8087`
- WebSocket 连接正常（防火墙不阻止）
- 建议使用有线网络或稳定的 Wi-Fi

## 功能演示

### 演示 1：远程桌面操作

1. 创建容器
2. 打开 VNC 桌面
3. 在远程桌面中打开文件管理器、浏览器等应用
4. 观察操作是否流畅

### 演示 2：音频播放

1. 创建容器并打开 VNC 桌面
2. 在远程桌面中打开 YouTube
3. 播放一段视频
4. 启动音频流
5. 验证是否能听到音频

### 演示 3：中文输入

1. 创建容器并打开 VNC 桌面
2. 在远程桌面中打开文本编辑器（如 gedit）
3. 连接 IME 服务
4. 使用本地中文输入法输入一段文字
5. 发送到远程桌面
6. 验证文字是否正确显示

## 版本信息

- **测试页面版本**: v1.0
- **最后更新**: 2026-01-17
- **支持的 RCoder 版本**: v1.0.0+

## 反馈与建议

如果您在使用过程中有任何问题或建议，欢迎反馈！

---

**提示**: 首次使用建议按照"使用指南"的步骤逐步操作，熟悉各个功能后再进行综合测试。
人民大团结