基于 WebRTC 的多人视频通话，解决视频卡顿和回音
- 实现基于房间的多人（大于2人）webrtc 视频通话，在每两个对等端之间都建立一个连接，组成“全网状拓扑结构”
- 配套博文：https://laravue.org/#/articles/27
- 安装 redis (需要用到 redis 发布订阅)
- 安装 node > 6.0.0
- git clone https://github.com/zmecust/mutil-webrtc.git
- npm i
- npm run build
- node server.js
- 安装完之后，打开浏览器运行
localhost:3001
- Nginx 反向代理
线上环境修改 Room.vue 和 Welcome.vue 中的 const socket = io.connect('https://yourdomain');
如果部署到线上环境，可以配置 Nginx 反向代理，并且配置 SSL 证书（WebRTC 必须要使用安全协议，如：https & wss） 如下所示：
server {
listen 443 ssl;
ssl_certificate '你的 SSL 证书地址';
ssl_certificate_key '你的 SSL 证书地址';
ssl_session_cache shared:SSL:50m;
ssl_session_timeout 1d;
ssl_session_tickets off;
server_name '你的域名';
# 反向代理到 node 服务
location / {
proxy_pass http://127.0.0.1:3001;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header Host $host;
}
}
- pm2 or forever 守护进程
npm i -g pm2
pm2 start server.js
OR
npm i -g forever
forever start server.js
- 线上环境部署需要配置 stun 服务，否则不同域之间不能直接通信，部署参考：https://laravue.org/#/articles/33
- 如有任何疑问或者 bug，欢迎联系
[email protected]或[email protected]
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent