tongtongstudio
a73f61f366
- 新增 VideoRecorder 组件，支持 WebRTC 和自编码两种模式录制远端视频为 MP4 - 优化 SignalingClient 连接管理，修复 WebSocket 握手前 receive 导致的断开问题 - 重构控制面板 UI，支持统计信息折叠展开和录制控制按钮 - 添加录制状态指示、保存路径提示及断开自动取消录制逻辑 - 更新项目配置和文档，补充录制功能说明
70 lines
4.2 KiB
Markdown
70 lines
4.2 KiB
Markdown
# web_rtc_controller_ios
|
||
|
||
iOS 版 WebRTC 远程控制端，功能对齐 Android 端 `WebRTCController`，配合 `WebRTCSignalServer` 信令服务器与被控端 `WebRTCControlled` 使用。
|
||
|
||
## 环境要求
|
||
|
||
- Xcode 15 及以上
|
||
- iOS 15.0 及以上（iPhone / iPad）
|
||
- 依赖通过 Swift Package Manager 自动拉取：[stasel/WebRTC](https://github.com/stasel/WebRTC)（Google WebRTC 官方二进制封装）
|
||
|
||
## 架构：UIKit 与 SwiftUI 混用
|
||
|
||
| 层 | 技术 | 说明 |
|
||
| --- | --- | --- |
|
||
| 应用生命周期 | UIKit (`AppDelegate` / `SceneDelegate`) | `UIHostingController` 承载 SwiftUI 根视图 |
|
||
| 界面 | SwiftUI (`ContentView` / `AuthSheetView`) | 连接设置页、鉴权弹窗、控制面板、统计信息 |
|
||
| 视频渲染（WebRTC 模式） | UIKit (`RTCMTLVideoView`) | 经 `UIViewRepresentable` 嵌入 SwiftUI |
|
||
| 视频渲染（自编码模式） | UIKit (`AVSampleBufferDisplayLayer`) | H.264 裸流 VideoToolbox 硬解直显 |
|
||
| 触控捕获 | UIKit (`RemoteTouchView`) | 原始触摸事件实时转发，保证"跟手" |
|
||
| 状态管理 | Combine (`ControllerViewModel`) | `ObservableObject` 驱动 SwiftUI |
|
||
|
||
## 目录结构
|
||
|
||
```
|
||
web_rtc_controller_ios/
|
||
├── App/ # UIKit 生命周期入口
|
||
├── Signaling/ # 信令：SignalMessage(JSON) + WebSocket 客户端
|
||
├── Control/ # ControlMessage：与 control_message.proto 二进制兼容的手写 protobuf 编解码
|
||
├── WebRTC/ # WebRTCClient（PeerConnection/DataChannel）+ SelfCodecDecoder（自编码 H.264 解码）
|
||
├── Views/ # SwiftUI 页面 + UIKit 渲染/触控视图（UIViewRepresentable 桥接）
|
||
├── ViewModel/ # ControllerViewModel
|
||
└── Utils/ # 设备 ID 等工具
|
||
```
|
||
|
||
## 与 Android 端保持一致的协议
|
||
|
||
- **信令**（WebSocket + JSON）：`REGISTER` / `OFFER`(携带 `authType`/`authValue`) / `ANSWER` / `ICE_CANDIDATE` / `TARGET_OFFLINE` / `CONNECTION_REJECTED` / `REQUEST_ERROR` / `REQUEST_TIMEOUT`
|
||
- **控制通道** `control_channel`（可靠有序）：protobuf `ControlMessage`（MOTION_EVENT / SWIPE / KEY / SET_RESOLUTION / SET_STREAM_MODE 及被控端上报）
|
||
- **自编码视频通道** `video_channel`（不可靠低延迟）：`0xAB` 魔数分片协议（大端序），单元内为 H.264 Annex-B 裸流（CONFIG=SPS/PPS，FRAME=视频帧）
|
||
- **ICE**：`stun:stun.l.google.com:19302`、`stun:www.ttstd.com:3478`、`turn:www.ttstd.com:3478`
|
||
|
||
## 功能
|
||
|
||
- 连接信令服务器并注册（设备 ID 格式 `CTRL-XXXXXXXX`，本地持久化）
|
||
- 三种鉴权方式：免密连接 / 动态验证码 / 固定密码
|
||
- 远程屏幕实时观看 + 触控（跟手的原始 MotionEvent 转发 + 滑动补发 SWIPE）
|
||
- 导航键：返回 / 主页 / 多任务（Android keyCode 4 / 3 / 187）
|
||
- 分辨率切换：原始画质 / 1080P / 720P / 480P
|
||
- 串流模式切换：WebRTC（SRTP 视频轨）/ 自编码（DataChannel H.264 裸流 + VideoToolbox 硬解）
|
||
- 远端视频录制：连接后可将收到的画面录制为 MP4（两种串流模式均支持）
|
||
- 实时统计：分辨率、帧率、码率、RTT、链路类型（P2P/TURN）、编解码器等
|
||
|
||
## 录制说明
|
||
|
||
控制面板顶部「录制 / 停止」按钮用于录制远端画面，行为对齐 Android 端 `VideoRecorder`：
|
||
|
||
- **WebRTC 模式**：`WebRTCClient` 把远端视频轨 fan-out 一份给 `VideoRecorder`（实现 `RTCVideoRenderer`），
|
||
拿到解码后的 `CVPixelBuffer`，用 `AVAssetWriter` + H.264 硬编码封装为 MP4。
|
||
- **自编码模式**：`SelfCodecDecoder` 用 VideoToolbox 硬解出 AVCC 帧后回传给 `VideoRecorder`，
|
||
复用已解码的 H.264 帧写盘。
|
||
- 录制文件保存在 App 沙盒 `Documents/WebRTCRecordings/rec_YYYYMMDD_HHmmss.mp4`，停止后弹出保存路径提示。
|
||
- 断开连接时若仍在录制会自动取消（丢弃未保存内容）。
|
||
|
||
## 运行
|
||
|
||
1. 用 Xcode 打开 `web_rtc_controller_ios.xcodeproj`，首次打开等待 SPM 解析 WebRTC 依赖。
|
||
2. 在 Signing & Capabilities 中选择自己的开发团队。
|
||
3. 真机运行（模拟器无法验证硬解与摄像头相关能力，控制功能可用）。
|
||
4. 输入信令服务器地址（默认 `wss://www.ttstd.com/signal`）与被控端设备 ID，选择鉴权方式后连接。
|