HLS错误处理

简介: hls.js是一个JavaScript库,可实现HTTP Live Streaming客户端。 它依靠HTML5视频和MediaSource扩展进行播放。

HLS错误类型

Hls所有错误都通过唯一的单个事件发出信号。

每个错误按以下方式分类:

  • Hls.ErrorTypes.NETWORK_ERROR 对于网络相关的错误
  • Hls.ErrorTypes.MEDIA_ERROR 媒体/视频相关错误
  • Hls.ErrorTypes.OTHER_ERROR 对于所有其他错误

侦听错误示例代码:

hls.on(Hls.Events.ERROR, function (event, data) {
varerrorType=data.type;
varerrorDetails=data.details;
varerrorFatal=data.fatal;
switch (data.details) {
caseHls.ErrorDetails.FRAG_LOAD_ERROR:
// ....break;
default:
break;
}
});


致命错误恢复

hls.js 提供了通过以下 2 种方法尝试恢复致命网络和媒体错误:

  • hls.startLoad()用以恢复网络错误。
  • hls.recoverMediaError()用以恢复媒体错误。

错误恢复示例代码:

varhls=null;
functionfnCameraPlayer(id){  
varvideo=document.getElementById(id);
varvideoSrc=video.getAttribute('rtmpPath');
if (video.canPlayType('application/vnd.apple.mpegurl') ||video.canPlayType('application/x-mpegURL')) {
video.src=videoSrc;
video.addEventListener('loadedmetadata', function() {
video.play();
    });
  } elseif (Hls.isSupported()) {
hls=newHls();
hls.loadSource(videoSrc);
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED, function(event, data) {
video.play();
    });
hls.on(Hls.Events.ERROR, function (event, data) {
if (data.fatal) {  
switch(data.type) {
caseHls.ErrorTypes.NETWORK_ERROR: 
if (data.details===Hls.ErrorDetails.MANIFEST_LOAD_ERROR||data.details===Hls.ErrorDetails.MANIFEST_LOAD_TIMEOUT||data.details===Hls.ErrorDetails.MANIFEST_PARSING_ERROR) {
hls.loadSource(videoSrc)
          }
else {
hls.startLoad()
          }
break;
caseHls.ErrorTypes.MEDIA_ERROR:    
hls.recoverMediaError();
break;
default:
hls.destroy();
break;
        }
      }      
    });
  }
}


hls.swapAudioCodec()

如果调用后仍然引发媒体错误hls.recoverMediaError(),调用此方法可能有助于   解决音频解码器不匹配的问题。

工作流程应该是:

关于第一媒体错误:调用hls.recoverMediaError()

如果在第一个媒体错误之后快速引发另一个媒体错误:首先调用hls.swapAudioCodec(),然后调用hls.recoverMediaError()


参考地址:hls的使用方式

https://github.com/video-dev/hls.js/blob/master/docs/API.md#final-step-destroying-switching-between-streams

 

相关文章
|
编解码 Android开发 iOS开发
HLS直播协议详解
HLS直播协议详解
1359 2
|
编解码 移动开发 视频直播
一文详解 m3u8 视频格式与分析视频秒开优化
秒开指的是,一秒内成功加载的播放数/播放总数。本意是想对比一下m3u8与mp4视频格式,并了解m3u8格式优缺点,以确定一个大概优化方向。但对m3u8做简单了解后,觉的m3u8可能是一个优化方向。
13439 4
一文详解 m3u8 视频格式与分析视频秒开优化
|
安全 网络安全 数据安全/隐私保护
Xftp文件传输失败
Xftp文件传输失败
1983 0
|
小程序
小程序 video 组件播放本地视频(黑屏无法播放,报错:MEDIA_ERR_SRC_NOT_SUPPORTED)
小程序 video 组件播放本地视频(黑屏无法播放,报错:MEDIA_ERR_SRC_NOT_SUPPORTED)
1498 0
|
JavaScript 前端开发
JS之url进行编码和解码(三种方式)
JS之url进行编码和解码(三种方式)
19987 2
|
6月前
|
缓存 JSON 前端开发
第07课:Spring Boot集成Thymeleaf模板引擎
第07课:Spring Boot集成Thymeleaf模板引擎
603 0
第07课:Spring Boot集成Thymeleaf模板引擎
Vue3报错:Extraneous non-props attributes (style) were passed to component but could not be automatical
Vue3报错:Extraneous non-props attributes (style) were passed to component but could not be automatical
4947 1
|
JavaScript 前端开发 jenkins
【前端】vue项目打包Browserslist: caniuse-lite is outdated. Please run: npx update-browserslist-db@latest解决方案
【前端】vue项目打包Browserslist: caniuse-lite is outdated. Please run: npx update-browserslist-db@latest解决方案
3494 0
|
移动开发 Android开发 容器
uniapp中使用videojs构建H5直播播放器
【10月更文挑战第14天】这两天在开发H5直播带货功能模块,使用原生的video播放器播放不了m3u8的流地址,于是找了videojs,参考了网上的一些资料研究了一下,感觉还不错,videojs播放m3u8流地址还挺稳定的,下面就简单记录一下uniapp里面使用方式
1771 129
|
JavaScript 前端开发 Go
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
动态加载与异步加载 JavaScript 详解:加载远程js,加载成功后执行回调函数
2697 2