使用starRTC实现视频对讲功能

谁践踏了优雅 2022-10-23 09:54 154阅读 0赞

文章中用到的环境和项目：

*  搭建了CentOS7系统的虚拟机
 *  [starrtc-server][] (服务器)
 *  [starrtc-web][] (web端，视频对讲)
 *  [chrome74.0.3729.157][]

## 一、搭建基于CentOS7系统的starRTC服务器 ##

1、下载starrtc-server程序：  
`git clone https://gitee.com/starRTC/starrtc-server.git`

2、进入相应目录，直接执行`chmod +x *.sh && ./start.sh` 即可部署成功（进行web端的使用是进入web-supported目录），这里不做详细说明，单独部署请查阅[官方文档][starrtc-server]

3、开放需要的端口，根据需要去开启

#开放某个端口
    firewall-cmd --zone=public --add-port=端口/类型(tcp/udp) --permanent
    
    #防火墙重新加载配置
    firewall-cmd --reload
    
    #CentOS7关闭防火墙：
    systemctl stop firewalld
    #CentOS6关闭防火墙：
    service iptables stop
    
    #CentOS7禁用防火墙
    systemctl disable firewalld

<table> 
 <thead> 
  <tr> 
   <th>服务端</th> 
   <th>端口</th> 
   <th>web端需开放端口</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>msgServer</td> 
   <td>19903(tcp)</td> 
   <td>29991(tcp):https信任测试</td> 
  </tr> 
  <tr> 
   <td>voipServer</td> 
   <td>10086(udp) 44446(udp):P2P通讯</td> 
   <td>10087(tcp):websocket 10088(udp):webrtc 29992(tcp):https信任测试</td> 
  </tr> 
  <tr> 
   <td>chatRoomServer</td> 
   <td>19906(tcp)</td> 
   <td>29993(tcp):https信任测试</td> 
  </tr> 
  <tr> 
   <td>liveSrcServer</td> 
   <td>19931(udp)</td> 
   <td>19934(tcp):websocket 19935(udp):webrtc 29994(tcp):https信任测试</td> 
  </tr> 
  <tr> 
   <td>liveVdnServer</td> 
   <td>19928(udp)</td> 
   <td>19940(tcp):websocket 19941(udp):webrtc 29995(tcp):https信任测试</td> 
  </tr> 
  <tr> 
   <td>liveProxyServer</td> 
   <td>19932(tcp)</td> 
   <td></td> 
  </tr> 
 </tbody> 
</table>

## 二、搭建Web项目 ##

1、下载starrtc-web程序：  
`git clone https://gitee.com/starRTC/starrtc-web.git`

2、修改index.js中的privateURL、webrtcIP变量为服务器IP，将index.html文件在谷歌浏览器中打开（推荐使用74版本，[谷歌浏览器禁止自动更新][Link 1]）

3、没有更换过服务端自带的签名证书的话可能会出现wss连接错误，需先在浏览器中访问 https://服务器IP:29991-29995 五个对应的端口，遇到页面提示有风险时，点击继续访问直到出现页面，实在不想点的可以进入sdk目录找到star\_rtc\_lib.min.js文件，将wss:替换为ws: （有安全风险）

4、在同局域网下使用另一台电脑/手机，下载对应的demo或app，配置好IP后点击一对一视频，输入web端的id即可进行视频对讲（可通过starrtc-web根目录的android.png、app\_store.png进行下载）

[starrtc-windows][]下载及配置  
安卓APP配置：  
![安卓APP配置][APP]

## 三、测试中可能出现的问题 ##

1、WebSocket connection to ‘wss://服务器IP:19903/’ failed: Error in connection establishment: net::ERR\_CONNECTION\_REFUSED![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25vdjR0aA_size_16_color_FFFFFF_t_70]  
解决方法：注意对应服务是否启动、端口是否开放，以及是否访问过 https://服务器IP:29991-29995 （wss连接时出现的问题基本都是这些原因）

#查看服务是否开启
    ps -aux | grep Server

2、视频对讲时两边都只能看到本地的画面  
解决方法：首先看看日志是否正常，日志没问题的话建议更换浏览器版本，谷歌浏览器建议使用74版本([谷歌浏览器禁止自动更新][Link 1])

3、当web项目运行在服务器上时，远程访问出现：Uncaught TypeError: Cannot read property ‘getUserMedia’ of undefined  
![在这里插入图片描述][20210308173623931.png]  
解决方法：需要使用https方式进行访问，否则不允许打开摄像头/麦克风；也可以通过下面的方式进行非https获取摄像头/麦克风

1.  地址栏输入chrome://flags/, 搜索unsafely
2.  将Disabled改为Enabled，在文本框中输入要过滤的地址，如（IP地址根据服务器去修改）：http://192.168.1.151:8080
3.  点击文本框下面的\#unsafely-treat-insecure-origin-as-secure
4.  点击Relaunch Now按钮  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25vdjR0aA_size_16_color_FFFFFF_t_70 1]

[starrtc-server]: https://gitee.com/starRTC/starrtc-server
[starrtc-web]: https://gitee.com/starRTC/starrtc-web
[chrome74.0.3729.157]: https://download.csdn.net/download/nov4th/15654432
[Link 1]: https://blog.csdn.net/nov4th/article/details/114548737
[starrtc-windows]: https://gitee.com/starRTC/starrtc-windows
[APP]: /images/20221023/d217e3db8e874598bc8f23e1ec92782f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25vdjR0aA_size_16_color_FFFFFF_t_70]: /images/20221023/c2161c818e074758bfbb4ecdfd63ca08.png
[20210308173623931.png]: /images/20221023/d15fcb5970d345b6bf366ff71308d6f2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25vdjR0aA_size_16_color_FFFFFF_t_70 1]: /images/20221023/ee7cd9d744354b75914654ce38e92f3c.png