首先thumbplayer-core中定义了几个重要对象如下:

  • IPlayerCore:播放器的配置,例如是直播还是点播
  • IUrlConfig:播放地址的一个配置,包括cdn地址,一组备份地址(降低播放失败率),fileSize或者视频编码信息等等。
  • IVideoInfo:视频播放过程中产生的各种播放信息,例如视频的当前时间点、视频尺寸和当前状态等。

首先需要传入IPlayerCore配置创建一个player对象,我们调用player对象的play接口时,传入IUrlConfig(也就是包含了视频播放地址)。thumbplayer-core根据IUrlConfig开始播放视频,在这个播放过程中,可以通过player对象的currentVideoInfo来获取IVideoInfo对象(也就是当前正在播放的视频的各种信息)。

而在thumbplayer-core内部,我们整体上可以概括为三层

  • 第一层是接口层,定义了thumbplayer-core的公开方法、事件枚举、各种类型申明等
  • 第二层即核心播放层,这一部分真正开始处理视频数据,解码视频和渲染视频。这里实际上由多个“播放内核”组成,每一种“播放内核”处理一种视频格式或视频编码。“播放内核”由接口层的“内核工厂”根据传入的视频格式和浏览器环境综合判断来决定使用哪一种“播放内核”
  • 第三层为数据下载层,这里根据“播放内核”的不同使用不同的方式下载视频数据,比如通过xhr的range请求来模拟视频的流式加载,或者直接使用fetch进行真正的流式加载,或者使用p2p组件加载p2p数据(webrtc)。

我们可以从下图的调用图中大致描述出这三层的关系: design.002.png

上次更新: 7/30/2021, 10:16:56 AM