595 lines
13 KiB
Markdown
595 lines
13 KiB
Markdown
# Android 直播系统完整使用教程
|
||
|
||
## 目录
|
||
1. [系统架构说明](#系统架构说明)
|
||
2. [环境准备](#环境准备)
|
||
3. [启动后端服务](#启动后端服务)
|
||
4. [Android Studio 使用教程](#android-studio-使用教程)
|
||
5. [OBS Studio 推流教程](#obs-studio-推流教程)
|
||
6. [完整操作流程](#完整操作流程)
|
||
7. [常见问题解决](#常见问题解决)
|
||
|
||
---
|
||
|
||
## 系统架构说明
|
||
|
||
```
|
||
┌──────────────┐
|
||
│ 电脑 OBS │ ← 你在这里推流（摄像头/屏幕）
|
||
└──────┬───────┘
|
||
│ RTMP 推流
|
||
↓
|
||
┌──────────────┐
|
||
│ SRS 服务器 │ ← 接收推流，转换格式
|
||
│ (Docker) │
|
||
└──────┬───────┘
|
||
│
|
||
↓
|
||
┌──────────────┐
|
||
│ Node.js 后端 │ ← 管理直播间，提供 API
|
||
└──────┬───────┘
|
||
│ REST API
|
||
↓
|
||
┌──────────────┐
|
||
│ Android 应用 │ ← 观看直播
|
||
│ (模拟器) │
|
||
└──────────────┘
|
||
```
|
||
|
||
**角色说明**：
|
||
- **OBS**：主播端，用于推流（发送视频）
|
||
- **Android 应用**：观众端，用于观看直播
|
||
- **后端服务**：管理直播间，连接 OBS 和 Android
|
||
|
||
---
|
||
|
||
## 环境准备
|
||
|
||
### 1. 必需软件
|
||
|
||
#### ✅ 已安装
|
||
- [x] Node.js
|
||
- [x] Docker Desktop
|
||
- [x] Android Studio
|
||
- [x] Android 模拟器
|
||
|
||
#### 📥 需要下载
|
||
- [ ] **OBS Studio** - 推流软件
|
||
- 下载地址：https://obsproject.com/download
|
||
- 选择 Windows 版本
|
||
- 安装后重启电脑
|
||
|
||
### 2. 检查 Docker 容器
|
||
|
||
打开命令行，运行：
|
||
```bash
|
||
docker ps
|
||
```
|
||
|
||
应该看到 `srs-server` 容器正在运行：
|
||
```
|
||
CONTAINER ID IMAGE PORTS NAMES
|
||
f24a21e0bc02 ossrs/srs:5 0.0.0.0:1935->1935/tcp srs-server
|
||
0.0.0.0:8080->8080/tcp
|
||
0.0.0.0:1985->1985/tcp
|
||
```
|
||
|
||
如果没有运行，启动它：
|
||
```bash
|
||
cd live-streaming
|
||
docker-compose up -d
|
||
```
|
||
|
||
---
|
||
|
||
## 启动后端服务
|
||
|
||
### 步骤 1：打开命令行
|
||
|
||
在项目根目录打开 PowerShell 或 CMD
|
||
|
||
### 步骤 2：进入后端目录
|
||
```bash
|
||
cd live-streaming
|
||
```
|
||
|
||
### 步骤 3：启动服务器
|
||
```bash
|
||
node server/index.js
|
||
```
|
||
|
||
### 步骤 4：验证服务器运行
|
||
|
||
你应该看到类似输出：
|
||
```
|
||
[RoomStore] Loaded 1 rooms from storage
|
||
[Media Server] Embedded NodeMediaServer disabled (EMBEDDED_MEDIA_SERVER=0).
|
||
API 服务运行在 http://localhost:3001
|
||
API 服务也可通过 http://0.0.0.0:3001 访问（用于 Android 模拟器）
|
||
SRS RTMP: rtmp://localhost:1935/live/{streamKey}
|
||
SRS HTTP: http://localhost:8080/live/{streamKey}.flv
|
||
```
|
||
|
||
**⚠️ 重要**：保持这个命令行窗口打开，不要关闭！
|
||
|
||
### 步骤 5：测试服务器（可选）
|
||
|
||
打开浏览器访问：
|
||
```
|
||
http://localhost:3001/health
|
||
```
|
||
|
||
应该看到：
|
||
```json
|
||
{"status":"ok","timestamp":"2025-12-16T09:30:00.000Z"}
|
||
```
|
||
|
||
---
|
||
|
||
## Android Studio 使用教程
|
||
|
||
### 步骤 1：打开项目
|
||
|
||
1. 启动 **Android Studio**
|
||
2. 点击 **Open**
|
||
3. 选择 `android-app` 文件夹
|
||
4. 点击 **OK**
|
||
|
||
### 步骤 2：等待 Gradle 同步
|
||
|
||
- 首次打开会自动下载依赖
|
||
- 等待底部状态栏显示 "Gradle sync finished"
|
||
- 可能需要 5-10 分钟
|
||
|
||
### 步骤 3：启动 Android 模拟器
|
||
|
||
#### 方法 A：使用现有模拟器
|
||
1. 点击顶部工具栏的设备下拉菜单
|
||
2. 选择一个模拟器（如 Pixel 5 API 34）
|
||
3. 点击绿色的 ▶️ **Run** 按钮
|
||
|
||
#### 方法 B：创建新模拟器
|
||
1. 点击 **Tools** → **Device Manager**
|
||
2. 点击 **Create Device**
|
||
3. 选择 **Phone** → **Pixel 5**
|
||
4. 点击 **Next**
|
||
5. 选择系统镜像（推荐 **API 34**）
|
||
6. 点击 **Next** → **Finish**
|
||
7. 点击 ▶️ 启动模拟器
|
||
|
||
### 步骤 4：运行应用
|
||
|
||
1. 等待模拟器完全启动（显示主屏幕）
|
||
2. 在 Android Studio 中点击 ▶️ **Run 'app'**
|
||
3. 应用会自动安装并启动
|
||
|
||
### 步骤 5：创建直播间
|
||
|
||
在 Android 应用中：
|
||
|
||
1. 点击右上角的 **"开始直播"** 按钮
|
||
2. 填写信息：
|
||
- **直播间标题**：例如 "我的第一次直播"
|
||
- **主播名称**：例如 "小明"
|
||
3. 点击 **"创建"**
|
||
|
||
### 步骤 6：获取推流地址
|
||
|
||
创建成功后会显示一个对话框，包含：
|
||
|
||
```
|
||
推流地址：
|
||
rtmp://10.0.2.2:1935/live/868c49cc-1021-4664-95a3-ed71e789adb2
|
||
|
||
电脑本机 OBS 可用：
|
||
rtmp://localhost:1935/live/868c49cc-1021-4664-95a3-ed71e789adb2
|
||
|
||
⚠️ 注意：
|
||
1. Android 应用只能观看直播
|
||
2. 需要用 OBS 在电脑上推流
|
||
3. OBS 设置：服务器填上面地址即可
|
||
4. 推流后在应用中观看
|
||
```
|
||
|
||
**📋 复制推流地址**：
|
||
- 点击 **"复制地址"** 按钮
|
||
- 这个地址稍后在 OBS 中使用
|
||
|
||
### 步骤 7：查看直播间列表
|
||
|
||
- 点击 **"知道了"** 关闭对话框
|
||
- 你会看到刚创建的直播间
|
||
- 状态显示 **"未开播"**（灰色）
|
||
|
||
---
|
||
|
||
## OBS Studio 推流教程
|
||
|
||
### 步骤 1：下载并安装 OBS
|
||
|
||
1. 访问 https://obsproject.com/download
|
||
2. 下载 Windows 版本
|
||
3. 安装（使用默认设置）
|
||
4. 启动 OBS Studio
|
||
|
||
### 步骤 2：首次配置向导（如果出现）
|
||
|
||
如果是第一次打开 OBS，会出现配置向导：
|
||
|
||
1. **使用信息**：选择 "优化推流，录制次之"
|
||
2. **视频设置**：
|
||
- 基础分辨率：1920x1080
|
||
- FPS：30
|
||
3. **推流信息**：选择 "我将使用自定义流媒体服务器"
|
||
4. 点击 **"下一步"** 完成
|
||
|
||
### 步骤 3：配置推流设置
|
||
|
||
#### 3.1 打开设置
|
||
- 点击右下角 **"设置"** 按钮
|
||
- 或者菜单栏：**文件** → **设置**
|
||
|
||
#### 3.2 配置推流
|
||
1. 左侧选择 **"推流"**
|
||
2. **服务**：选择 "自定义..."
|
||
3. **服务器**：粘贴从 Android 应用复制的地址
|
||
```
|
||
rtmp://localhost:1935/live/868c49cc-1021-4664-95a3-ed71e789adb2
|
||
```
|
||
|
||
**⚠️ 重要**：
|
||
- 如果地址是 `rtmp://10.0.2.2:1935/...`，改成 `rtmp://localhost:1935/...`
|
||
- 完整地址包含 streamKey，不需要单独填写串流密钥
|
||
|
||
4. **串流密钥**：留空（因为已经包含在服务器地址中）
|
||
5. 点击 **"应用"**
|
||
|
||
#### 3.3 配置输出（可选，优化画质）
|
||
1. 左侧选择 **"输出"**
|
||
2. **输出模式**：简单
|
||
3. **视频比特率**：2500 Kbps
|
||
4. **编码器**：x264
|
||
5. 点击 **"应用"**
|
||
|
||
#### 3.4 配置视频（可选）
|
||
1. 左侧选择 **"视频"**
|
||
2. **基础分辨率**：1920x1080
|
||
3. **输出分辨率**：1280x720
|
||
4. **常用 FPS 值**：30
|
||
5. 点击 **"确定"**
|
||
|
||
### 步骤 4：添加视频源
|
||
|
||
#### 方法 A：添加摄像头
|
||
1. 在 **"来源"** 区域点击 **+** 号
|
||
2. 选择 **"视频捕获设备"**
|
||
3. 命名：例如 "摄像头"
|
||
4. 点击 **"确定"**
|
||
5. **设备**：选择你的摄像头
|
||
6. 点击 **"确定"**
|
||
|
||
#### 方法 B：添加屏幕捕获
|
||
1. 在 **"来源"** 区域点击 **+** 号
|
||
2. 选择 **"显示器捕获"**
|
||
3. 命名：例如 "屏幕"
|
||
4. 点击 **"确定"**
|
||
5. **显示器**：选择要捕获的屏幕
|
||
6. 点击 **"确定"**
|
||
|
||
#### 方法 C：添加窗口捕获
|
||
1. 在 **"来源"** 区域点击 **+** 号
|
||
2. 选择 **"窗口捕获"**
|
||
3. 命名：例如 "浏览器"
|
||
4. 点击 **"确定"**
|
||
5. **窗口**：选择要捕获的窗口
|
||
6. 点击 **"确定"**
|
||
|
||
### 步骤 5：调整画面
|
||
|
||
- 拖动红色边框调整大小
|
||
- 拖动中心调整位置
|
||
- 右键源 → **变换** → **适应屏幕** 可以自动适配
|
||
|
||
### 步骤 6：开始推流
|
||
|
||
1. 点击右下角 **"开始推流"** 按钮
|
||
2. 按钮变成 **"停止推流"**，底部状态栏显示：
|
||
```
|
||
直播中 | 00:00:15 | 2500 kb/s | 0 丢帧
|
||
```
|
||
|
||
**✅ 推流成功标志**：
|
||
- 状态栏显示 "直播中"
|
||
- 有比特率数据（如 2500 kb/s）
|
||
- 丢帧数为 0 或很少
|
||
|
||
**❌ 推流失败标志**：
|
||
- 提示 "连接失败"
|
||
- 状态栏显示红色错误
|
||
- 检查推流地址是否正确
|
||
|
||
### 步骤 7：在 Android 应用中观看
|
||
|
||
1. 回到 Android 模拟器
|
||
2. 在直播间列表中，你的直播间状态应该变成 **"直播中"**（红色）
|
||
3. 点击直播间进入
|
||
4. 等待 2-3 秒，视频开始播放
|
||
5. 你应该能看到 OBS 中的画面
|
||
|
||
---
|
||
|
||
## 完整操作流程
|
||
|
||
### 🎬 完整演示流程
|
||
|
||
#### 第一步：启动所有服务（5 分钟）
|
||
|
||
```bash
|
||
# 1. 启动 Docker（如果未运行）
|
||
cd live-streaming
|
||
docker-compose up -d
|
||
|
||
# 2. 启动后端服务器
|
||
node server/index.js
|
||
# 保持窗口打开！
|
||
```
|
||
|
||
#### 第二步：启动 Android 应用（3 分钟）
|
||
|
||
1. 打开 Android Studio
|
||
2. 打开 `android-app` 项目
|
||
3. 启动模拟器
|
||
4. 运行应用（点击 ▶️）
|
||
|
||
#### 第三步：创建直播间（1 分钟）
|
||
|
||
1. 在 Android 应用中点击 **"开始直播"**
|
||
2. 填写标题和主播名称
|
||
3. 点击 **"创建"**
|
||
4. 点击 **"复制地址"** 复制推流地址
|
||
5. 点击 **"知道了"**
|
||
|
||
#### 第四步：配置 OBS（2 分钟）
|
||
|
||
1. 打开 OBS Studio
|
||
2. 点击 **"设置"** → **"推流"**
|
||
3. 服务：选择 "自定义..."
|
||
4. 服务器：粘贴推流地址（改 `10.0.2.2` 为 `localhost`）
|
||
5. 点击 **"确定"**
|
||
|
||
#### 第五步：添加视频源（2 分钟）
|
||
|
||
1. 点击 **"来源"** 区域的 **+** 号
|
||
2. 选择 **"视频捕获设备"**（摄像头）或 **"显示器捕获"**（屏幕）
|
||
3. 配置并确定
|
||
|
||
#### 第六步：开始直播（1 分钟）
|
||
|
||
1. 在 OBS 中点击 **"开始推流"**
|
||
2. 等待 2-3 秒
|
||
3. 回到 Android 模拟器
|
||
4. 点击直播间进入
|
||
5. 观看直播！🎉
|
||
|
||
---
|
||
|
||
## 常见问题解决
|
||
|
||
### ❌ 问题 1：Android 应用显示"网络错误"
|
||
|
||
**原因**：后端服务器未启动
|
||
|
||
**解决**：
|
||
```bash
|
||
cd live-streaming
|
||
node server/index.js
|
||
```
|
||
|
||
验证：浏览器访问 http://localhost:3001/health
|
||
|
||
---
|
||
|
||
### ❌ 问题 2：OBS 提示"连接失败"
|
||
|
||
**原因 A**：推流地址错误
|
||
|
||
**解决**：
|
||
1. 检查地址格式：`rtmp://localhost:1935/live/{streamKey}`
|
||
2. 确保使用 `localhost` 而不是 `10.0.2.2`
|
||
3. 确保包含完整的 streamKey
|
||
|
||
**原因 B**：SRS 服务器未运行
|
||
|
||
**解决**：
|
||
```bash
|
||
docker ps
|
||
# 如果没有 srs-server，运行：
|
||
cd live-streaming
|
||
docker-compose up -d
|
||
```
|
||
|
||
---
|
||
|
||
### ❌ 问题 3：Android 应用显示"未开播"
|
||
|
||
**原因**：后端无法检测到推流
|
||
|
||
**解决**：
|
||
1. 确认 OBS 正在推流（状态栏显示"直播中"）
|
||
2. 检查后端日志是否有错误
|
||
3. 重启后端服务器
|
||
4. 在 Android 应用中下拉刷新
|
||
|
||
**验证推流状态**：
|
||
浏览器访问 http://localhost:1985/api/v1/streams/
|
||
应该看到你的 streamKey
|
||
|
||
---
|
||
|
||
### ❌ 问题 4：视频播放黑屏
|
||
|
||
**原因 A**：HLS 转码未启用
|
||
|
||
**解决**：
|
||
检查 `live-streaming/.env` 中是否有 FFmpeg 配置
|
||
```env
|
||
FFMPEG_PATH=C:\path\to\ffmpeg.exe
|
||
```
|
||
|
||
**原因 B**：网络延迟
|
||
|
||
**解决**：
|
||
- 等待 5-10 秒
|
||
- 退出直播间重新进入
|
||
- 检查网络连接
|
||
|
||
**原因 C**：Android 播放器不支持格式
|
||
|
||
**解决**：
|
||
查看后端日志，确认 HLS 地址可用
|
||
|
||
---
|
||
|
||
### ❌ 问题 5：模拟器无法连接到后端
|
||
|
||
**原因**：防火墙阻止
|
||
|
||
**解决**：
|
||
```powershell
|
||
# 以管理员身份运行 PowerShell
|
||
netsh advfirewall firewall add rule name="Node.js API" dir=in action=allow protocol=TCP localport=3001
|
||
```
|
||
|
||
---
|
||
|
||
### ❌ 问题 6：重启后端后房间消失
|
||
|
||
**原因**：已修复！现在房间会自动保存
|
||
|
||
**验证**：
|
||
检查 `live-streaming/data/rooms.json` 文件是否存在
|
||
|
||
---
|
||
|
||
### ❌ 问题 7：OBS 画面卡顿
|
||
|
||
**原因**：比特率过高或电脑性能不足
|
||
|
||
**解决**：
|
||
1. OBS 设置 → 输出
|
||
2. 降低视频比特率：2500 → 1500 Kbps
|
||
3. 降低分辨率：1080p → 720p
|
||
4. 降低帧率：60fps → 30fps
|
||
|
||
---
|
||
|
||
## 快速参考
|
||
|
||
### 端口说明
|
||
| 端口 | 服务 | 用途 |
|
||
|------|------|------|
|
||
| 1935 | RTMP | OBS 推流 |
|
||
| 8080 | HTTP-FLV/HLS | 视频播放 |
|
||
| 1985 | SRS API | 推流状态检测 |
|
||
| 3001 | Node.js API | Android 应用接口 |
|
||
|
||
### 关键地址
|
||
| 用途 | 地址 |
|
||
|------|------|
|
||
| OBS 推流 | `rtmp://localhost:1935/live/{streamKey}` |
|
||
| Android API | `http://10.0.2.2:3001/api/` |
|
||
| 健康检查 | `http://localhost:3001/health` |
|
||
| SRS 状态 | `http://localhost:1985/api/v1/streams/` |
|
||
|
||
### 常用命令
|
||
```bash
|
||
# 启动后端
|
||
cd live-streaming
|
||
node server/index.js
|
||
|
||
# 启动 Docker
|
||
docker-compose up -d
|
||
|
||
# 查看 Docker 容器
|
||
docker ps
|
||
|
||
# 停止 Docker
|
||
docker-compose down
|
||
|
||
# 查看端口占用
|
||
netstat -ano | findstr :3001
|
||
```
|
||
|
||
---
|
||
|
||
## 视频教程（建议录制）
|
||
|
||
如果你想录制视频教程，可以按照以下脚本：
|
||
|
||
### 📹 脚本大纲
|
||
|
||
1. **开场**（30秒）
|
||
- "大家好，今天教大家如何搭建一个 Android 直播系统"
|
||
- 展示最终效果：OBS 推流 → Android 观看
|
||
|
||
2. **环境准备**（2分钟）
|
||
- 展示必需软件
|
||
- 检查 Docker 运行状态
|
||
|
||
3. **启动后端**（1分钟）
|
||
- 打开命令行
|
||
- 运行 `node server/index.js`
|
||
- 展示成功日志
|
||
|
||
4. **Android Studio**（3分钟）
|
||
- 打开项目
|
||
- 启动模拟器
|
||
- 运行应用
|
||
- 创建直播间
|
||
- 复制推流地址
|
||
|
||
5. **OBS 配置**（3分钟）
|
||
- 打开设置
|
||
- 配置推流地址
|
||
- 添加视频源
|
||
- 开始推流
|
||
|
||
6. **观看直播**（1分钟）
|
||
- 回到 Android 应用
|
||
- 点击直播间
|
||
- 展示播放效果
|
||
|
||
7. **结尾**（30秒）
|
||
- 总结关键步骤
|
||
- 提醒常见问题
|
||
|
||
---
|
||
|
||
## 下一步学习
|
||
|
||
### 🚀 进阶功能
|
||
- [ ] 添加聊天功能
|
||
- [ ] 添加礼物打赏
|
||
- [ ] 添加观众人数统计
|
||
- [ ] 支持多个直播间
|
||
- [ ] 添加直播回放
|
||
|
||
### 📚 推荐资源
|
||
- OBS 官方文档：https://obsproject.com/wiki/
|
||
- SRS 文档：https://ossrs.net/
|
||
- Android ExoPlayer：https://exoplayer.dev/
|
||
|
||
---
|
||
|
||
## 技术支持
|
||
|
||
如果遇到问题：
|
||
1. 查看本教程的"常见问题解决"部分
|
||
2. 查看 `android-app/问题修复总结.md`
|
||
3. 查看后端日志输出
|
||
4. 查看 Android Studio 的 Logcat
|
||
|
||
---
|
||
|
||
**祝你使用愉快！🎉**
|