这种播放内核用于播放hls协议的视频,包括点播和直播。(实际上,hls播放内核基于业界优秀的开源组件hls.js开发,在此基础上进行了优化和扩展)

# 使用

在thumbplayer-core中,我们可以按如下方式播放hls视频:

import { KernelFactory } from '@tencent/thumbplayer-core';
// 引入hls播放内核,播放内核会自注册到thumbplayer-core中
import '@tencent/thumbplayer-kernel-txhlsjs';

const player = KernelFactory.create({
  container: '.container',
});
player.play({
  url: 'https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/hls.m3u8',
});

# 配置项(非必须)

const player = KernelFactory.create({
  container: '.container',
  // 增加hls播放内核配置
  hlsjsKernelConfig: {
    // hls播放的缓冲区大小,单位秒
    maxBufferLength: 180,
  }, 
});

hls播放内核常见配置项如下:

字段名 类型 说明
maxBufferLength number 播放器缓存数据的最大时长
fragLoadingMaxRetryTimeout number 分片下载的最大时长(加载超时时间)
fragLoadingRetryDelay number 分配重试的延迟时长
fragLoadingMaxRetry number 分片重试次数,设置重试为3次
manifestLoadingMaxRetry number m3u8最大重试次数
manifestLoadingRetryDelay number m3u8的重试延迟时长
manifestLoadingTimeOut number m3u8下载的最大时长

更多字段可参考Hls.Config

# 专有事件

player.on('hlsInstanceChange', () => {
  console.log('Hls instance: ', player.getHls());
});

另外有需要的话,您也可以监听Hls.Events中的枚举来获取hls.js派发出来的事件。

# 错误码

此播放内核播放时产生的错误码参考

上次更新: 5/23/2022, 8:25:08 PM