WebRtc简单浏览器会议通信Demo

概述

1. 本说明基于该项目：https://github.com/qdgx/WebRtcRoomServer

2. 下载：WebRtcRoomServer-master.zip

部署

信令服务器

下载概述中提供的项目源码后，我们解压进入项目文件夹目录，执行下方指令运行信令服务器：

运行前先安装node.js，推荐v20.18.2版本

#安装依赖
npm install

#运行
node .\app.js

运行后成功后，是没有任何打印的。

客户端

我们打开项目目录下的htmlTest\webRtc.html文件，将下面的代码中的IP调整为运行信令服务器的电脑的IP：

var socket = io('wss://172.16.70.226:8443');

修改完成后，我们直接本地运行webRtc.html文件，可以看到：

我们随机填写房间名称后，点击create按钮可创建并加入房间，另外一个电脑填写同样的房间名称，进入后即可进行会议视频对讲。

需要注意的是：

由于信令服务器运行所用的https证书是自签名非正式的，我们浏览器在加入会议时，需要浏览器先手动点击验证https连接（只需一次），才能正常加入房间，不然会提示ERR_CERT_AUTHORITY_INVALID错误。

另外，由于html文件是在本地浏览器打开的，所以不需要https，如果是部署到云服务器等环境，同样需要https和证书正确才能正常调用webrtc。

解析

本文章里面用的项目，其信令服务器的设计，主要是通过自定义的指令规范，通过socket.io.js借助websocket技术实现服务器和客户端的通信和指令控制。

会议的音视频流处理，则通过浏览器原生支持的RTCPeerConnection技术实现。

其中html中客户端，还指定了STUN地址，用于帮助浏览器发现彼此的公网地址，实现浏览器间的实时音视频通信。