这种播放内核用于播放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派发出来的事件。
# 错误码
此播放内核播放时产生的错误码参考