Ubuntu上如何搭建基于webrtc的多人视频聊天服务

145次阅读

共计 4760 个字符，预计需要花费 12 分钟才能阅读完成。

这篇文章主要讲解了“Ubuntu 上如何搭建基于 webrtc 的多人视频聊天服务”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着丸趣 TV 小编的思路慢慢深入，一起来研究和学习“Ubuntu 上如何搭建基于 webrtc 的多人视频聊天服务”吧！

webrtc，即 web real-time communication，web 实时通信技术。简单地说就是在 web 浏览器里面引入实时通信，包括音视频通话等。

一个简单的聊天室 html 页面

这个页面使用 simple-webrtc 来实现 webrtc 的通讯，simple-webrtc 是对几个 webrtc 核心对象的封装，所以使用这个会比较简单。

!doctype html 
 html 
 head 
  title webrtc chat room  /title 
  style 
 video {
 height: 200px;
 width: 200px;
 border: 1px solid cornflowerblue;
 border-radius: 3px;
 margin: 10px;
 }
  /style 
 /head 
 body 
  div 
 roomid:  input id= roomid  type= text  value= /   input type= button  id= btnstart  value= join room 
  /div 
 
  div 
 nick name:  input id = nickname  readonly= readonly  type =  text  value= 
  /div 
  h3 
 self:
  /h3 
  video id= localvideo /video 
  div id= remotevideos 
  h3 
 remote clients:
  /h3 
  /div 
  script src= https://cdn.bootcss.com/jquery/3.3.0/jquery.min.js /script 
  script src= js/simplewebrtc-with-adapter.bundle.js /script 
  script 
 $(#nickname).val(new date().gettime()); 
 var qs = function (key) { return (document.location.search.match(new regexp( (?:^\\?|)  + key +  =(.*?)(?= |$) )) || [, null])[1];
 };
 var roomid = qs( roomid 
 if (roomid) { $( #roomid).val(roomid);
 }
 else { $( #roomid).val( 99999 
 }
 // $(#roomid).val(roomid);
 var smurl =  https://webrtc.xxx.com:8800 
 var webrtc = new simplewebrtc({
 // the id/element dom element that will hold  our  video
 localvideoel:  localvideo ,
 // the id/element dom element that will hold remote videos
 remotevideosel:  remotevideos ,
 // immediately ask for camera access
 autorequestmedia: true,
 url: smurl,
 nick: $(#nickname).val(),
 });
 webrtc.on(readytocall , function () {
 // you can name it anything
 console.log( connectioned . 
 });
 webrtc.on(createdpeer , function (peer) { console.log( createdpeer , peer, peer.nick );
 if (peer.nick) {
 alert( client  + peer.nick +   joined 
 }
 });
 webrtc.on(joinedroom , (roomname )= { console.log( joinedroom , roomname );
 alert(joined room   + roomname );
 });
 webrtc.on(leftroom , (roomname )= { console.log( leftroom , roomname );
 });
 webrtc.on(videoadded , (videoel, peer )= { console.log( videoadded , videoel, peer );
 if (peer.nick) {
 alert( client  + peer.nick +   joined 
 }
 });
 webrtc.on(videoremoved , (videoel, peer )= { console.log( videoremoved , videoel, peer );
 });
 $(#btnstart).click(function(){ var roomid = $( #roomid).val();
 webrtc.joinroom(roomid); 
 // alert(join room  + roomid +  success) 
 })
 //$(#btnstart).click();
  /script 
 /body 
 /html

安装 nginx 并部署聊天室页面

安装 nginx：

sudo apt-get install nginx

配置 nginx：

server {
 listen 80;
 listen 443;
 server_name webrtc.xxx.com;
 location / {
 index index.html;
 root html/www;
 }
 ssl on;
 ssl_certificate /ssl/xxx.crt;
 ssl_certificate_key /ssl/xxx.key;
 ssl_session_timeout 5m;
 ssl_protocols tlsv1 tlsv1.1 tlsv1.2;
 ssl_ciphers ecdhe-rsa-aes128-gcm-sha256:high:!anull:!md5:!rc4:!dhe;
 }

安装完成 nginx 后把上面的 html 页面使用 nginx 部署到服务器。注意需要走 https，因为 chrome 的设定不走 https 没法调用起摄像头跟麦克风。

安装并配置 signalmaster 信令服务

信令服务是用来在客户端之间传输 webrtc 的客户端信息。因为在 webrtc 建立 p2p 连接的时候需要对方客户端的相关信息，所以需要一个渠道来转发客户端之间的信息。signalmaster 是一个基于 nodejs 的服务，使用 socket.io 实现 websocket 长连接。

安装 signalmaster:

git clone https://github.com/simplewebrtc/signalmaster.git

配置 signalmaster：

cd signalmaster
cd config
vim development.json
  isdev : true,
  server : {
  port : 8800,
  /* secure */ :  /* whether this connects via https */ ,
  secure : true,
  cert :  /ssl/xxx.crt ,
  key :  /ssl/xxx.key ,
  password : null
 },
  rooms : {
  /* maxclients */ :  /* maximum number of clients per room. 0 = no limit */ ,
  maxclients : 0
 },
  stunservers : [
 {
  urls :  stun:webrtc.xxx.com:3478 
 }
 ],
  turnservers : [
 {  urls : [ turn:webrtc.xxx.com:3478],
  username :  abc ,
  credential :  123 ,
  secret :  ,
  expiry : 86400
 }
 ]
~

这里主要注意的是也需要配置 ssl 证书，证书使用上面 nginx 那个证书即可。另外 trunserver 如果设置了密码也需要配置正确的用户名跟密码。

安装并配置 coturn 穿透服务

我们的客户端一般都在局域网之内，所以 p2p 连接建立的时候需要进行内网穿透。使用 coturn 建立 turnserver 作为穿透服务。

安装 coturn：

# deps
apt-get install -y \
 emacs-nox \
 build-essential \
 libssl-dev sqlite3 \
 libsqlite3-dev \
 libevent-dev \
 g++ \
 libboost-dev \
 libevent-dev
# download
wget https://github.com/coturn/coturn/archive/4.5.0.7.tar.gz
tar xvf 4.5.0.7.tar.gz
# build   install
cd coturn-4.5.0.7
./configure --prefix=/opt
make install
# env
echo  export path=/opt/bin:$path    ~/.bashrc
source ~/.bashrc

配置 coturn：

cd coturn-4.5.0.7
vim coturn.conf
#server
listening-port=3478
listening-ip= 
relay-ip= 
alt-listening-port=0
external-ip= 
realm=abc
# server-name={your_server_name}
no-tls
no-dtls
mobility
no-cli
verbose
fingerprint
# auth
lt-cred-mech
stale-nonce=3600
# user
#  这里是演示，不配置数据库，通过  use={name}:{password}  方式配置
# userdb=/opt/var/db/turndb
#  多用户则写多行
user=abc:123

这里主要需要注意的是 ip 的配置 listening-ip= 内网 ip，relay-ip= 内网 ip，external-ip= 外网 ip?；褂?user 配置了话，信令服务器也要配置对应的用户名密码。

运行所有服务

运行信令服务：

cd signalmaster
node server.js

运行穿透服务器：

cd coturn-4.5.0.7
turnserver -c coturn.conf

访问一下 nginx 部署的静态页面就可以啦?？礁鐾?，自己可以跟自己试一下，最好找其他朋友试一下，有的时候穿透服务没配置好的时候，自己跟自己是可以的，但是跟其他人就不可以了。

感谢各位的阅读，以上就是“Ubuntu 上如何搭建基于 webrtc 的多人视频聊天服务”的内容了，经过本文的学习后，相信大家对 Ubuntu 上如何搭建基于 webrtc 的多人视频聊天服务这一问题有了更深刻的体会，具体使用情况还需要大家实践验证。这里是丸趣 TV，丸趣 TV 小编将为大家推送更多相关知识点的文章，欢迎关注！

正文完