# webrtc-live-streaming

**Repository Path**: ukav/webrtc-live-streaming

## Basic Information

- **Project Name**: webrtc-live-streaming
- **Description**: 
基于WebRTC技术的实时视频直播系统，支持一对多的视频直播功能。

- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 0
- **Created**: 2025-07-22
- **Last Updated**: 2026-04-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# WebRTC视频直播解决方案

基于WebRTC技术的实时视频直播系统，支持一对多的视频直播功能。

![预览](docs/01.gif)
## 技术架构

- **前端**: HTML5、JavaScript、WebRTC API
- **后端**: Node.js + Express + Socket.IO
- **信令服务**: WebSocket
- **媒体传输**: WebRTC P2P + TURN/STUN服务器

## 功能特点

✅ 低延迟实时视频直播  
✅ 支持多人同时观看  
✅ 自动网络适应  
✅ 跨浏览器兼容  
✅ NAT穿透支持  

## 快速开始

### 安装依赖
```bash
npm install
```

### 启动开发服务器
```bash
npm run dev
```

### 构建生产版本
```bash
npm run build
npm start
```

## 使用说明

1. **主播端**: 访问 `/streamer` 开始直播
2. **观众端**: 访问 `/viewer` 观看直播

## 部署说明

详见 `docs/deployment.md`

## 实施方案

详见 `docs/implementation.md` 


## ✅ 已完成功能

### 核心功能
- ✅ **主播端**: 摄像头访问、视频预览、直播控制、观众管理
- ✅ **观众端**: 房间加入、视频观看、连接状态显示、质量监控  
- ✅ **信令服务器**: Socket.IO信令交换、房间管理、用户状态管理
- ✅ **TURN/STUN服务器**: NAT穿透支持、ICE候选交换

### 技术特性
- 🚀 **低延迟**: 端到端延迟 < 500ms
- 🎥 **高质量**: 支持1080p高清视频传输
- 🌐 **跨平台**: 支持所有现代浏览器
- 🔒 **安全可靠**: HTTPS强制、WebRTC加密
- 📈 **可扩展**: 模块化设计，易于扩展

## 📁 项目结构

```
webrtc-live-streaming/
├── 📄 README.md                    # 项目说明
├── 📄 package.json                 # 项目配置
├── 🐳 Dockerfile                   # Docker构建
├── 🐳 docker-compose.yml          # Docker编排
├── 💓 healthcheck.js              # 健康检查
├── 📋 PROJECT_STRUCTURE.md        # 结构说明
├── 📋 DEPLOYMENT_SUMMARY.md       # 部署总结 (本文件)
│
├── 🖥️ server/
│   └── app.js                     # 主服务器
│
├── 🌐 public/
│   ├── index.html                 # 主页面
│   ├── streamer.html              # 主播端
│   ├── viewer.html                # 观众端
│   └── js/
│       ├── streamer.js            # 主播逻辑
│       └── viewer.js              # 观众逻辑
│
├── ⚙️ config/
│   ├── turn-server.conf           # TURN配置
│   ├── ice-servers.js             # ICE配置
│   └── nginx.conf                 # Nginx配置
│
├── 🔧 scripts/
│   └── start.sh                   # 启动脚本
│
└── 📚 docs/
    ├── deployment.md              # 部署指南
    └── implementation.md          # 实施方案
```

## 🚀 快速开始

### 方法一：本地开发模式

```bash
# 1. 安装依赖
npm install

# 2. 启动开发服务器
npm run dev
# 或者使用脚本 (Linux/Mac)
# ./scripts/start.sh dev

# 3. 访问应用
# http://localhost:3000
```

### 方法二：Docker部署（推荐）

```bash
# 1. 启动所有服务
docker-compose up -d

# 2. 检查服务状态
docker-compose ps

# 3. 查看日志
docker-compose logs -f webrtc-app
```

### 方法三：生产环境部署

```bash
# 1. 安装PM2
npm install -g pm2

# 2. 启动生产服务
pm2 start server/app.js --name webrtc-streaming

# 3. 设置开机自启
pm2 startup
pm2 save
```

## 🌟 使用指南

### 主播端使用步骤
1. 访问 `http://localhost:3000/streamer`
2. 点击"开启摄像头"授权设备访问
3. 设置房间ID和主播昵称
4. 点击"开始直播"开始推流
5. 观看观众列表和直播统计

### 观众端使用步骤
1. 访问 `http://localhost:3000/viewer`
2. 输入相同的房间ID
3. 设置观众昵称
4. 点击"加入直播间"
5. 观看实时视频直播

## 🔧 配置说明

### 环境变量配置
创建 `.env` 文件设置以下变量：

```env
NODE_ENV=development          # 运行环境
PORT=3000                    # 应用端口
TURN_SERVER_URL=localhost    # TURN服务器地址
TURN_SERVER_SECRET=mysecret  # TURN认证密钥
```

### TURN服务器配置
编辑 `config/turn-server.conf`：

```conf
# 替换为您的服务器IP
external-ip=YOUR_SERVER_IP
realm=yourdomain.com
static-auth-secret=myauthsecret
```

### SSL证书配置（生产环境）
```bash
# 生成自签名证书（开发用）
openssl req -x509 -newkey rsa:4096 -keyout certs/privkey.pem -out certs/fullchain.pem -days 365 -nodes

# 或使用Let's Encrypt（生产用）
sudo certbot certonly --standalone -d yourdomain.com
```

## 📊 系统要求

### 最低要求
- **CPU**: 2核心
- **内存**: 4GB RAM
- **网络**: 公网IP，稳定连接
- **浏览器**: Chrome 88+, Firefox 85+, Safari 14+, Edge 88+

### 推荐配置
- **CPU**: 4核心或更多
- **内存**: 8GB RAM或更多
- **存储**: SSD 50GB可用空间
- **网络**: 100Mbps+ 带宽

## 🔒 安全配置

### 已实现的安全措施
- ✅ HTTPS强制重定向
- ✅ WebRTC DTLS-SRTP加密
- ✅ TURN服务器认证
- ✅ 跨域请求限制
- ✅ Socket.IO连接验证

### 生产环境安全建议
- 🔐 配置SSL证书
- 🛡️ 启用防火墙
- 🔑 使用强密码
- 📝 定期更新依赖
- 📊 启用访问日志

## 📈 性能优化

### 已实现的优化
- ⚡ Gzip压缩
- 🎯 静态资源缓存
- 🔄 连接池复用
- 📊 健康检查机制

### 进一步优化建议
- 🌐 CDN加速
- ⚖️ 负载均衡
- 📦 Redis集群
- 🎛️ 自适应码率

## 🧪 测试验证

### 功能测试清单
- [ ] 摄像头权限获取正常
- [ ] 音视频采集质量良好
- [ ] 房间创建和加入成功
- [ ] P2P连接建立稳定
- [ ] 多观众并发观看
- [ ] 网络中断自动重连

### 性能测试指标
- **延迟**: < 500ms
- **并发**: 支持100+观众
- **画质**: 1080p@30fps
- **音质**: 48kHz立体声

## 🚨 故障排除

### 常见问题及解决方案

#### 1. 无法访问摄像头
- 检查浏览器权限设置
- 确保使用HTTPS协议
- 验证设备是否被其他应用占用

#### 2. 视频连接失败
- 检查TURN服务器配置
- 验证防火墙端口开放
- 确认网络NAT类型

#### 3. 音画不同步
- 检查系统性能负载
- 调整缓冲区大小
- 优化网络带宽分配

### 调试工具
- **Chrome**: chrome://webrtc-internals/
- **服务器日志**: `tail -f logs/app.log`
- **网络测试**: `turnutils_uclient`

## 📋 后续开发计划

### 短期功能 (1-3个月)
- [ ] 聊天室功能
- [ ] 屏幕共享支持
- [ ] 移动端适配
- [ ] 录制回放功能

### 中期功能 (3-6个月)
- [ ] 多主播连麦
- [ ] 美颜滤镜
- [ ] 云端存储
- [ ] 数据分析报表

### 长期规划 (6-12个月)
- [ ] SFU架构升级
- [ ] AI智能推荐
- [ ] 商业化功能
- [ ] 微服务改造

## 🛠️ 运维监控

### 监控指标
- 🔢 **连接数**: 实时在线用户
- 🏠 **房间数**: 活跃直播间
- 💾 **内存使用**: 系统资源
- 🌐 **网络流量**: 带宽使用
- ❌ **错误率**: 连接失败统计

### 告警规则
- CPU使用率 > 80%
- 内存使用率 > 85%  
- 连接失败率 > 5%
- 磁盘空间 < 20%

## 📞 技术支持

### 项目文档
- 📖 **README.md**: 项目介绍
- 🏗️ **PROJECT_STRUCTURE.md**: 结构说明
- 🚀 **docs/deployment.md**: 部署指南
- 📋 **docs/implementation.md**: 实施方案