VePlayer 提供视频资源预加载功能，支持手动执行预加载和 Feed 流视频播放场景下自动执行预加载，降低首帧耗时，优化起播体验。

效果展示 #

视频起播阶段无需请求数据，直接使用预加载缓冲数据进行起播，效果如下图所示。

兼容性说明 #

• 封装格式：当前仅支持 MP4 格式。
• 播放模式：当前仅支持 DirectUrl 模式，暂不支持 Vid 模式。
• 播放环境：需要浏览器支持 MSE，适用于 PC、Android、iOS（仅支持 iOS 17.1 以上系统）。

工作原理 #

初始化预加载模块 #

调用 prepare 初始化预加载模块：

VePlayer.prepare({
  appId: number; // 应用 ID，您可在视频点播控制台应用管理页面获取
  strategies: {
     preload: boolean | IPreloadConfig; // 开启预加载高级能力，可设置 boolean 值直接使用默认配置，可以配置预加载初始参数
  }
})

手动执行预加载 #

手动模式下，您需要提前设置预加载资源列表。实例化播放器时如果该视频资源目标时长已加载完成，则直接使用预加载缓存数据起播，播放阶段从缓存数据往后继续下载新数据。

1. 设置预加载模式为手动模式：

   VePlayer.setPreloadScene(0)
   

2. 设置预加载资源列表：

   VePlayer.setPreloadList(list: IPreloadStream[])
   

   说明

   • 手动模式下播放器会将预加载资源全部添加至预加载任务队列。
   • 播放器不会对已经在播放中的视频执行预加载。
   • 详细参数说明请见 IPreloadStream。

3. 使用预加载数据：

   1. 创建播放器实例：

      new VePlayer({
          playList: [ IPreloadStream ], // 当前播放视频信息
          vid: 'xxxvid', // 视频唯一 ID
          enableMp4MSE: true, // 开启 MP4 MSE 模式播放
      })
      

   2. 切换播放视频：

      playerSdk.playNext({
         playList: [ IPreloadStream ], // 当前播放视频信息
         vid: 'xxxvid', // // 视频唯一 ID
      })
      

自动执行预加载 #

VePlayer 针对 Feed 流视频播放场景提供自动预加载功能。设置待预加载资源列表后，播放器会根据当前播放视频的 ID 自动检索待预加载视频列表，将当前视频的前 prevCount 个和后 nextCount 个视频添加到预加载任务队列，并根据当前视频状态动态执行预加载操作。

1. 设置预加载模式为自动模式并设置 prevCount 和 nextCount：

   VePlayer.setPreloadScene(1,{
     prevCount: 1, // 加载当前播放视频前 1 个视频
     nextCount: 2, // 加载当前播放视频后 2 个视频
   })
   

2. 设置待预加载资源列表：

   // 设置待预加载列表，根据当前播放视频的 ID，检索待预加载视频列表，将当前视频前 prevCount 个和后 nextCount 个加入预加载任务队列，根据当前视频状态执行预加载。
   VePlayer.setPreloadList(list: IPreloadStream[])
   

   说明

   • 播放器不会对已经在播放中的视频执行预加载。
   • 详细参数说明请见 IPreloadStream。

3. 使用预加载数据：

   1. 创建播放器实例：

      new VePlayer({
          playList: [ IPreloadStream ], // 当前播放视频信息
          vid: 'xxxvid', // 视频唯一 ID
          enableMp4MSE: true, // 开启 MP4 MSE 模式播放
      })
      

   2. 切换视频：

      playerSdk.playNext({
         playList: [ IPreloadStream ],// 当前播放视频信息
         vid: 'xxxvid', // // 视频唯一id
      })
      

   说明

   创建播放器实例和切换视频时，播放器会根据 vid、playList 检索当前视频是否存在已预加载数据。如果存在已预加载数据，将直接使用该数据，并触发一次预加载任务检测。

相关 API #

• VePlayer.preloader.removeAll()：移除所有预加载数据。不影响后续预加载任务执行
• VePlayer.preloader.removeAllPreloadTask()：取消所有预加载任务，清空预加载资源列表，移除当前的任务列表，并中断当前正在加载的任务。
• VePlayer.preloader.clearPreloadList()：清除所有待预加载资源列表。

#