0、服务器环境
- Centos7
- Node.js v14.0.0
- GCC >= 4.9(CentOS7默认的gcc版本是v4.8.5,mediasoup由于使用了大量c++11特性,要求>= 4.9)
- Python 2.7.5(3也没问题,不过要注意编译脚本需要的python的命令,对python3做个软链接好了)
1、node.js安装
通过nvm安装的node.js开发运行环境 (这里获取最新的nvm install script)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
完成后,退出再登陆,使环境变量生效(或使用source命令刷新,使之立即生效)
安装node.js v14.0.0
nvm ls-remote
nvm install 14.0.0
npm install -g node-gyp
2、生成自签名证书
v3新版本demo没有生成证书,需要自行生成证书并且放置相对应的目录。
如果你有自己的域名和证书是最好了,如果没有生成针对IP的自签名证书,也没有问题,测试足够了。
使用如下名称生成 HTTPS
协议使用的公钥和私钥对,其中key表示私钥,crt表示公钥
openssl req -new -newkey rsa:2048 -x509 -sha256 -days 3650 -nodes -out fullchain.pem -keyout privkey.pem
生成证书后,将证书和私钥文件复制到 mediasoup-demo/server/certs
目录下
3、下载部署mediasoup-demo
3.1 克隆项目
git clone https://github.com/versatica/mediasoup-demo.git
cd mediasoup-demo
git checkout v3
目前的默认分支其实已经是v3了,代码有4个目录
aiortc
app // 客户端代码
broadcasters // 用户推流模块,比如用FFmpeg推流到mediasoup。
server // 服务端代码,包括信令服务+媒体服务
3.2 安装server
cd server
npm install
会下载node需要的module,其中c++部分的mediasoup代码会下载到 mediasoup-demo/server/node_modules/mediasoup 目录下,这个目录其实就是 mediasoup ,这个项目worker目录下是c++,修改后直接make就可以。
编译安装结束会有个提示:
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
这个fsevents是mac下用的,如果是warn提示,忽略即可;
如果是error错误:
npm update
npm install
若是还无法解决,请升级node版本。
3.3 配置修改
接下来根据实际修改配置文件,从 config.example.js 复制一份修改就好
cp config.example.js config.js
vim config.js
修改几个地方如下:
listenIp用0.0.0.0,也没发现有问题。tls的配置路径为步骤2生成的证书路径。
https :
{
listenIp : '0.0.0.0',
// NOTE: Don't change listenPort (client app assumes 4443).
listenPort : process.env.PROTOO_LISTEN_PORT || 4443,
// NOTE: Set your own valid certificate files.
tls :
{
cert : process.env.HTTPS_CERT_FULLCHAIN || `../certs/fullchain.pem`,
key : process.env.HTTPS_CERT_PRIVKEY || `../certs/privkey.pem`
}
},
webRtcTransportOptions 和 plainTransportOptions的listenIps.ip设置你的内网ip,announcedIp为公网ip(不设置的话,置为null)
webRtcTransportOptions :
{
listenIps :
[
{
ip : '10.206.142.12',
announcedIp: null,
}
],
initialAvailableOutgoingBitrate : 1000000,
minimumAvailableOutgoingBitrate : 600000,
maxSctpMessageSize : 262144,
// Additional options that are not part of WebRtcTransportOptions.
maxIncomingBitrate : 1500000
},
修改完配置文件后,启动服务
[root@bogon server]# npm start
> mediasoup-demo-server@3.0.0 start /home/chenpk/mediasoup-demo/server
> DEBUG=${DEBUG:='*mediasoup* *INFO* *WARN* *ERROR*'} INTERACTIVE=${INTERACTIVE:='true'} node server.js
process.env.DEBUG: *mediasoup* *INFO* *WARN* *ERROR*
...
...
...
mediasoup-demo-server:INFO running 4 mediasoup Workers... +0ms
mediasoup createWorker() +0ms
mediasoup:Worker constructor() +0ms
mediasoup:Worker spawning worker process: /home/chenpk/mediasoup-demo/server/node_modules/mediasoup/worker/out/Release/mediasoup-worker --logLevel=warn --logTag=info --logTag=ice --logTag=dtls --logTag=rtp --logTag=srtp --logTag=rtcp --logTag=rtx --logTag=bwe --logTag=score --logTag=simulcast --logTag=svc --logTag=sctp --rtcMinPort=40000 --rtcMaxPort=49999 +0ms
mediasoup:Channel constructor() +0ms
mediasoup:PayloadChannel constructor() +0ms
[opening Readline Command Console...]
type help to print available commands
cmd> mediasoup:Worker worker process running [pid:18363] +18ms
mediasoup createWorker() +19ms
mediasoup:Worker constructor() +1ms
mediasoup:Worker spawning worker process: /home/chenpk/mediasoup-demo/server/node_modules/mediasoup/worker/out/Release/mediasoup-worker --logLevel=warn --logTag=info --logTag=ice --logTag=dtls --logTag=rtp --logTag=srtp --logTag=rtcp --logTag=rtx --logTag=bwe --logTag=score --logTag=simulcast --logTag=svc --logTag=sctp --rtcMinPort=40000 --rtcMaxPort=49999 +0ms
mediasoup:Channel constructor() +16ms
mediasoup:PayloadChannel constructor() +17ms
mediasoup:Worker worker process running [pid:18365] +14ms
mediasoup createWorker() +14ms
mediasoup:Worker constructor() +0ms
mediasoup:Worker spawning worker process: /home/chenpk/mediasoup-demo/server/node_modules/mediasoup/worker/out/Release/mediasoup-worker --logLevel=warn --logTag=info --logTag=ice --logTag=dtls --logTag=rtp --logTag=srtp --logTag=rtcp --logTag=rtx --logTag=bwe --logTag=score --logTag=simulcast --logTag=svc --logTag=sctp --rtcMinPort=40000 --rtcMaxPort=49999 +0ms
mediasoup:Channel constructor() +15ms
mediasoup:PayloadChannel constructor() +14ms
mediasoup:Worker worker process running [pid:18367] +14ms
mediasoup createWorker() +15ms
mediasoup:Worker constructor() +1ms
mediasoup:Worker spawning worker process: /home/chenpk/mediasoup-demo/server/node_modules/mediasoup/worker/out/Release/mediasoup-worker --logLevel=warn --logTag=info --logTag=ice --logTag=dtls --logTag=rtp --logTag=srtp --logTag=rtcp --logTag=rtx --logTag=bwe --logTag=score --logTag=simulcast --logTag=svc --logTag=sctp --rtcMinPort=40000 --rtcMaxPort=49999 +0ms
mediasoup:Channel constructor() +14ms
mediasoup:PayloadChannel constructor() +15ms
mediasoup:Worker worker process running [pid:18369] +13ms
mediasoup-demo-server:INFO creating Express app... +63ms
mediasoup-demo-server:INFO running an HTTPS server... +6ms
mediasoup-demo-server:INFO running protoo WebSocketServer... +20ms
3.4 编译安装app
- 打开另一个终端
cd /root/mediasoup-demo/app/ #进入自己的mediasoup-demo/app目录
npm install
- 全局安装
gulp-cli
:
npm install -g gulp-cli
- 启动app
[root@bogon app]# npm start(或gulp live)
> mediasoup-demo-app@3.0.0 start /root/mediasoup-demo/app
> gulp live
[11:10:11] NODE_ENV: development
[11:10:11] Using gulpfile /root/mediasoup-demo/app/gulpfile.js
[11:10:11] Starting 'live'...
[11:10:11] Starting 'browser:base'...
[11:10:11] Starting 'clean'...
[11:10:11] Finished 'clean' after 20 ms
[11:10:11] Starting 'lint'...
[11:10:14] Finished 'lint' after 2.79 s
[11:10:14] Starting 'bundle:watch'...
[11:10:23] Finished 'bundle:watch' after 9.08 s
[11:10:23] Starting 'html'...
[11:10:23] Finished 'html' after 5.21 ms
[11:10:23] Starting 'css'...
[11:10:24] Finished 'css' after 785 ms
[11:10:24] Starting 'resources'...
[11:10:24] Finished 'resources' after 34 ms
[11:10:24] Starting 'watch'...
[11:10:24] Finished 'watch' after 18 ms
[11:10:24] Finished 'browser:base' after 13 s
[11:10:24] Starting '<anonymous>'...
[11:10:24] Finished '<anonymous>' after 23 ms
[11:10:24] Finished 'live' after 13 s
[Browsersync] Access URLs:
--------------------------------------------------
Local: https://localhost:3000/?info=true
External: https://192.168.70.26:3000/?info=true
--------------------------------------------------
UI: http://localhost:3001
UI External: http://localhost:3001
--------------------------------------------------
[Browsersync] Serving files from: ../server/public
[Browsersync] Watching files...
4、打开本地的浏览器测试
地址:https://10.206.142.12:3000
访问时会随机分配一个roomId
另一个客户端就可以带上这个roomid加入,比如
https://xxx.xxx.xxx.xxx:3000/?roomId=c6dkrubz&info=true&forceH264=true
参数info=true会打开统计栏,forceH264=true会强制使用H264,如下图:
可以通过URL参数进行设置,相关URL参数及说明如下表所示:
参数 | 说明 |
roomId | 会议室ID,任意字符串 |
displayName | 当前用户昵称,任意字符串 |
sipEndpoint | 是否是SIP终端,true-是,false-否,默认false |
simulcast | 是否开启Simulcast,true-是,false-否,默认true |
forceTcp | 是否强制使用TCP,true-是,false-否,默认false |
spy | 是否spy,true-是,false-否,默认false |
forceH264 | 是否强制当前终端使用H264编码,true-是,false-否,默认false |
5、Nginx
发布 app
为简化 app
的发布,因此使用 nginx
部署 HTTPS
服务器,发布客户端
其中 /home/mediasoup/mediasoup-demo/server/public
目录为客户端发布目录
5.1 nginx
配置如下所示:
user root;
worker_processes auto;
#error_log logs/error.log;
events {
worker_connections 1024;
}
http {
include mime.types;
# aio on;
gzip on;
gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
gzip_buffers 16 8k;
gzip_http_version 1.1;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
# HTTP server required to serve the player and HLS fragments
server {
listen 3000 ssl;
ssl_certificate /home/ygt/mediasoup-demo/server/certs/fullchain.pem;
ssl_certificate_key /home/ygt/mediasoup-demo/server/certs/privkey.pem;
ssl_session_cache shared:SSL:10m;
ssl_session_timeout 10m;
location / {
root /home/ygt/mediasoup-demo/server/public;
try_files $uri /index.html;
index index.html index.htm index.php;
}
location ~* \.(css|gif|ico|jpg|js|png|ttf|woff)$ {
root /home/ygt/mediasoup-demo/server/public;
}
location ~* \.(eot|otf|ttf|woff|svg)$ {
add_header Access-Control-Allow-Origin *;
root /home/ygt/mediasoup-demo/server/public;
}
}
}
5.2 启动 nginx
启动 nginx
服务器,发布客户端
/etc/init.d/nginx start
然后再打开浏览器,输入 https:\\10.206.142.12:3000
进入房间
6. 修改默认配置
demo的客户端默认监听在 3000 端口,当需要更改客户端默认监听端口时,需在 mediasoup-demo/app/gulpfile.js
文件中的 browserSync
添加端口配置,具体方式如下:
browserSync(
{
open : 'external',
host : config.domain,
port : 15024,
startPath : '/?info=true',
server :
{
baseDir : OUTPUT_DIR
},
https : config.https.tls,
ghostMode : false,
files : path.join(OUTPUT_DIR, '**', '*')
});
服务器端的 HTTPS 默认端口为4443(config.js),也可以根据自己的需求修改配置端口。倘若,修改了HTTPS的监听端口,
客户端代码亦需要修改对应端口,修改 mediasoup-demo/app/lib/urlFactory.js
文件中的端口:
// let protooPort = 4443;
let protooPort = 15025;
修改完成后,在 mediasoup-demo/app
路径下执行 gulp
命令打包客户端代码。客户端代码打包成功后,前端客户端页面会发布到 mediasoup-demo/server/public
路径下。
完成配置修改后,客户端将对 15024
端口进行监听服务。
参考链接: