WebRTC篇

1. 什么是 WebRTC？

• WebRTC项目的官网在 https://webrtc.org/。按MDN官网中文页面的介绍：

1）WebRTC (Web Real-Time Communications) 是一项实时通讯技术，它允许网络应用或者站点，在不借助中间媒介的情况下，建立浏览器之间点对点（Peer-to-Peer）的连接，实现视频流和（或）音频流或者其他任意数据的传输。WebRTC包含的这些标准使用户在无需安装任何插件或者第三方的软件的情况下，创建点对点（Peer-to-Peer）的数据分享和电话会议成为可能。 2）API 接口：https://developer.mozilla.org/zh-CN/docs/Web/API/WebRTC_API 3）说白了，WebRTC就是W3C定的一个Web标准，用来做二进制数据传输用的，各浏览器只要支持WebRTC，就可以不通过插件，直接在Web端实现诸如音频、视频、文件等二进制数据的传输，听上去很方便吧，不需要再使用Flash、Silverlight之类的插件了，but，理想很丰满，现实往往很残酷，WebRTC从诞生之初到现在仍然还有很多地方布满了坑。 有兴趣的可以到这里看看有关WebRTC的前世今生 https://www.html5rocks.com/en/tutorials/webrtc/basics/

2. WebRTC支持情况

• 现代浏览器基本都支持，像Chrome、Firefox包括Edge之类的支持程度都还好，尤其是Chrome，毕竟是亲生的，支持程度是最好的，具体的浏览器版本支持情况可以到 CanIUse 上检查 https://caniuse.com/#search=webrtc
• 另外可以参考腾讯云实时音视频 WebRTC 官方文档介绍：https://cloud.tencent.com/document/product/647/16863#.E6.94.AF.E6.8C.81.E7.9A.84.E5.B9.B3.E5.8F.B0

3. 如何快速确认本地浏览器环境是否支持 WebRTC？

• 腾讯云提供了 WebRTC 能力测试：https://www.qcloudtrtc.com/webrtc-samples/abilitytest/index.html

4. WebRTC 接入相关注意事项

• 不是所有浏览器都支持WebRTC
• 不是所有支持WebRTC的浏览器都支持全部的标准方法
• 同一款浏览器的桌面版与移动版对WebRTC支持不同
• 同一款、同一端的浏览器不同版本号对WebRTC支持不同
• 不能被浏览器识别的输入设备Web页面必然拿不到
• 不能被浏览器支持的编解格式必然显示不了，浏览器支持的格式视频有H.264/VP8/VP9，音频有Opus/iSAC
• WebRTC必然要打洞，不支持P2P直连的网络请放弃
• WebRTC标准带了安全校验，必须走https，调试可以走localhost
• 画面不显示，有可能是没有拿到数据，也可能是 <video> 标签没有处理好
• 官网常见问题请看 https://cloud.tencent.com/document/product/647/17017

5. TRTC Web SDK (WebRTC) 版本更新介绍

• 目前线上的版本同时有3.x和4.x版本，其中4.x版本属于 TRTC Web SDK (WebRTC) 重构版本，相比前者提供 Client/Stream 模式的接口，各对象职责更明确，语义更简洁明了。
• 重构版本与旧版本不兼容，除接口改动之外，还提供如下功能： 1）视频属性 （分辨率、帧率及码率）控制完全由 App 通过 SDK 的 LocalStream.setVideoProfile() 接口设置，不再支持老版本通过腾讯云控制台的“画面设定 （Spear Role）”。 2）SDK 在 Stream 对象中封装了音视频播放器，音视频播放完全由 SDK 控制。 3）提供远端流的订阅与取消订阅功能，开发者可以通过 Client.subscribe()/unsubscribe() 接口灵活控制远端流的音频、视频或音视频数据流的接收。
• 更多版本更新信息，参考文档：https://cloud.tencent.com/document/product/647/38958

6. 摄像头/麦克风相关设备拿不到问题

• 根据原理，直接在页面打开控制台，输入 navigator.mediaDevices.enumerateDevices() 看看能不能获取到设备列表，拿不到说明浏览器都没有识别到设备，检查浏览器或检查设备；
• 能拿到设备列表的情况下，输入 navigator.mediaDevices.getUserMedia({"audio":true,"video":true}) 看能不能正常返回 MediaStream 对象，不能正常返回说明浏览器没有拿到数据，检查一下浏览器的配置。

7. 画面显示不了问题

• 先确认的确有拿到数据
• 根据原理，检查 <video> 元素的 srcObject 属性是否正常赋值了正确的 mediastream 对象，不对的话肯定显示不了；
• 有部分情况是浏览器的问题，检查一下浏览器是不是编解码器挂了，一般重启浏览器，或重启系统（设备被其他进程占用时就不能用），chrome如果硬件编解码不行的时候，可以在 chrome://flags 里面把 #enable-webrtc-h264-with-openh264-ffmpeg 这个标记设置为 enable ，强制软件编解码，不过看标记名字也知道，使用的是ffmpeg调用openh264库，性能消耗会有点大。

8. WebRTC 音视频过程中出现回声问题

• 同一房间收发的人隔得太近的时候，请离远一点；
• 某些设备上有回声，没办法，编解码是浏览器控制的，不是我们SDK控制，只能等浏览器厂商来解决。

9. WebRTC 网络连接不上/超时等问题

• 网络连接不上的，先检查防火墙。另外，目前腾讯云已有部署 STUN 服务器和 TURN 服务器提高连接成功率，不过还是存在有些P2P直连不成功的网络类型（对称型NAT的），这种建议先换网络；
• 网络抗抖动能力觉得不好的，WebRTC 的网络传输是浏览器控制，其自带的QoS是NetEQ，这个东西已经上了年纪，而且算法简单粗暴，能够抵抗一定程度的网络抖动，但抗抖动能力有限，稍微多一点就不行了，加上浏览器的 <video>在渲染和显示机制上有点坑，所以最终画面显示效果受很容易受网络影响，因此在当前WebRTC标准还不是特别完善的情况下，网络一定要好一点。

10. WebRTC 视频过程中出现画面模糊问题

• 设备采集、编解码、网络都依赖浏览器，我们音视频SDK控制不了。所以，设备好，浏览器好，网络好的不容易有问题，不好的就不行。

11. 部分Android 手机无法正常运行 WebRTC 问题

• 部分 Android 机型，比如华为由于浏览器检测不到系统的 H264 的硬解模块，用海思处理器的基本都不支持。在移动端 WebRTC 方案不推荐，建议小程序解决方案。

12. 查看密钥时只能获取公钥和私钥信息，要如何获取密钥？

• TRTC SDK（2019年08月）开始启用新的签名算法 HMAC-SHA256。在此之前已创建的应用，需要先单击【第二步 获取签发UserSig的密钥】区域的【点此升级】升级签名算法才能获取新的加密密钥。如不升级，您也可以继续使用老版本算法 ECDSA-SHA256。

13. WebRTC 出现客户端错误：“RtcError: no valid ice candidate found”该如何处理？

• 出现该错误说明 TRTC Web SDK 在 STUN 打洞失败，请根据 环境要求 检查防火墙配置。

14. 出现客户端错误："RtcError: ICE/DTLS Transport connection failed" 或 “RtcError: DTLS Transport connection timeout”该如何处理？

• 出现该错误说明 TRTC Web SDK 在建立媒体传输通道时失败，请根据 环境要求 检查防火墙配置。

15. 出现10006 error 该如何处理？

• 如果出现"Join room failed result: 10006 error: service is suspended,if charge is overdue,renew it"，请确认您的实时音视频应用的服务状态是否为可用状态。 登录 实时音视频控制台，单击您创建的应用，单击【帐号信息】，在帐号信息面板即可确认服务状态。