如果浏览器不支持WebRTC或者RTS拉流失败时,您可以选择降级至HLS、FLV播放。本文为您介绍使用客户自研播放器集成Web RTS SDK和直接使用阿里云播放器Aliplayer两种场景的降级播放。
概述
使用RTS播放可以考虑降级处理的场景包括以下情况:
浏览器不支持WebRTC或H.264。
说明Web RTS SDK依赖浏览器对WebRTC技术的支持,对市面上常见浏览器进行了兼容性测试,支持情况详见浏览器要求。通过Web RTS SDK提供的
isSupport
函数,可以检查当前浏览器环境是否满足要求。如果您的目标浏览器确定支持WebRTC但又不在上述列表中,您可以充分测试后针对这些浏览器选择跳过isSupport
检查直接进行拉流。信令请求失败(拉流地址无效、HTTPS配置无效、RTS配置无效等原因)。
起播超时或中途断流。
下文分别介绍使用自研播放器集成Web RTS SDK和直接使用阿里云播放器Aliplayer如何处理上述三种情况的降级。
场景一:使用自研播放器集成RTS
说明
需要Web RTS SDK为V2.5.1及以上版本,请参见发布日志。
该示例为精简后的代码,为方便开发者使用,您可以下载RTS降级完整示例代码。
/**
* 可以降级的情况:
* 1. 浏览器不支持,在 isSupport().catch 中处理
* 2. 建连过程、播放中出现<重连失败>错误,在 onError 事件监听10410错误码
**/
var pullStreamUrl = 'RTS拉流地址';
var fallbackUrl = '降级拉流地址,如HLS';
// 初始化 SDK
var aliRts = AliRTS.createClient();
aliRts.on('onError', (error) => {
console.log(error.errorCode, error.message); // 错误码、错误信息
// 降级判断
switch(error.errorCode){
case 10410: // 拉流(订阅)重连彻底失败
fallback(); // 降级
break;
default:
}
});
// 检测浏览器是否支持
// 对于不在视频直播 > 操作指南 > 超低延时直播 > Web RTS SDK > Web RTS拉流SDK > 其他播放器集成Web RTS SDK > SDK简介 章节中的浏览器,可以选择跳过 isSupport 检查,直接执行 subscribeRts 拉流(有风险,需要自测保证)
aliRts.isSupport({ isReceiveVideo: true }).then(subscribeRts).catch(fallback)
function subscribeRts() {
aliRts.subscribe(pullStreamUrl, {
// mediaTimeout: 6000 // 自定义超时事件的触发时间
// retryTimes: 5, // 自定义重连次数 默认5
// retryInterval: 2000,// 自定义重连间隔 默认2000ms
}).then((remoteStream) => {
remoteStream.play(mediaElement);
}).catch(() => {})
}
// 降级至其他协议播放
function fallback() {
// 此处为示例,可以根据您选择的降级 url 选择合适的播放器
hlsPlayer.play(fallbackUrl)
}
场景二:使用阿里云播放器Aliplayer集成RTS
阿里云播放器Aliplayer集成了Web RTS SDK,可以用于播放RTS流,并且内置了RTS自动降级逻辑,您只需要提供一个降级地址即可使用。
说明
需要Aliplayer为V2.9.23及以上版本,请参见Web播放器SDK。
该示例为精简后的代码,为方便开发者使用,您可以下载Aliplayer自动降级完整示例代码
/**
* 播放器默认播放 source 提供的 rts 拉流地址,如果失败,则会自动降级至 rtsFallbackSource 提供的拉流地址(如 HLS 地址)。
* 可能的降级场景包括:
* 1. 浏览器不支持 RTS,直接降级
* 2. RTS 信令请求失败(拉流地址无效、HTTPS配置无效、RTS配置无效等),直接降级
* 3. RTS 起播超时或中途断流,按自定义策略重试失败后降级
**/
var options = {
"id": "player-con",
"source": "RTS播放地址",
"rtsFallbackSource": "降级地址,如HLS",
"width": "100%",
"height": "500px",
"autoplay": true,
"isLive": true,
"playsinline": true,
"skipRtsSupportCheck": false, // 对于不在视频直播 > 操作指南 > 超低延时直播 > Web RTS SDK > Web RTS拉流SDK > 其他播放器集成Web RTS SDK > SDK简介 章节中的浏览器,可以传 true 跳过检查,强制使用 RTS(有风险,需要自测保证)
/**
* RTS 拉流超时会默认重试
* 以下两个参数用来控制降级之前的重试策略,比如 3000 毫秒超时,重试一次,如果再拉不到流就降级,那么总共等待 6000 毫秒降级
**/
// RTS 多久拉不到流会重试,默认 3000 ms
// rtsLoadDataTimeout: 2000,
// RTS 拉不到流重试的次数,默认 5,此参数建议设为 1,即重试 1 次后降级,可以减少降级等待时间
liveRetry: 1,
};
var player = new Aliplayer(options, function () {/* player ready */});
// 降级时会触发此事件
player.on('rtsFallback', function(event) {
// event.paramData.reason 降级的原因
// event.paramData.fallbackUrl 降级到的地址
})
微信小程序可以使用Web RTS SDK吗?
由于微信小程序无法解析RTS信令协议,所以Web RTS SDK无法在原生微信小程序中使用,但是可以将包含SDK的网页嵌入到小程序Webview中使用。