WebRTC 技术在现代浏览器中受到 HTTPS 协议的限制,尤其是在音视频通信、摄像头访问等敏感操作时,必须通过 HTTPS 协议进行访问。这是为了保障数据传输的安全性,防止被攻击或信息泄露,因此在非 HTTPS 环境下,浏览器会限制或禁用 WebRTC 的部分功能。
小鱼易连Web SDK 是基于WebRTC实现的实时音视频解决方案,为了确保其在生产环境中的功能可以顺利启用,用户必须使用HTTPS协议访问音视频应用页面。若采用HTTP协议,浏览器则会限制音视频采集、屏幕共享等功能,影响用户体验。
提示
http://localhost
协议进行访问;npx live-server
命令快速搭建静态 Web Server 服务;URL域名及协议支持情况请参考如下表格:
应用场景 | 协议 | 接收远端音视频流 | 发送本地音视频流 | 屏幕共享 | 备注 |
生产环境 | HTTPS | 支持 | 支持 | 支持 | 推荐 |
生产环境 | HTTP | 支持 | 不支持 | 不支持 | 强烈不推荐 |
本地开发环境 | http://localhost http://127.0.0.1 | 支持 | 支持 | 支持 | 推荐 |
本地开发环境 | http://[本机IP] | 支持 | 不支持 | 不支持 | 不推荐 |
本地开发环境 | file:// | 支持 | 支持 | 支持 | 不推荐 |
当页面访问的域名是 IP 地址 或使用的是 自签名证书 时,大多数浏览器或客户端会直接标记页面为“不安全”或“不受信任”。请求相应的服务,会显示类似 ERR_CERT_AUTHORITY_INVALID
的错误提示。需要手动信任证书才能继续使用。如图所示:
但需注意以下几点:
提示
建议使用正式且可信的证书。
SDK 内部默认强制要求使用 HTTPS 协议的服务地址,以确保数据传输的安全性。
如果确实需要使用 HTTP 协议的服务地址,可通过调用createClient方法配置 checkSSL为false关闭此强制限制,但需要用户自行承担由此可能带来的安全风险。
// 导入主文件
import XYRTC from '@xylink/xy-rtc-sdk';
const XYClient = XYRTC.createClient({
// 可选,是否需要检测SSL,默认值是true,代表启用检测SSL协议
checkSSL: false
// 其他配置
...
});
默认情况下,浏览器不允许 HTTP 协议下的任何内容(包含通过 iframe 嵌入 HTTPS 的页面)访问WebRTC相关接口,会导致麦克风/摄像头采集失败,无法传输音视频流等异常情况,因此建议业务部署后,统一使用HTTPS访问页面;
但可以通过临时放开不安全的域名,让浏览器支持采集音视频等能力,浏览器的具体操作如下:
Chrome浏览器地址栏输入:chrome://flags/#unsafely-treat-insecure-origin-as-secure
Edge浏览器地址栏输入:edge://flags/#unsafely-treat-insecure-origin-as-secure
配置完成后,在页面底部选择重启浏览器,等待重启完成后,再次访问地址测试;