SkeyeWebPlayer.js H5播放器是怎么样炼成的

SkeyeWebPlayer.js H5播放器是由成都视开信息科技开发和维护的一个完善的RTSP、FLV、HLS等多种流媒体协议播放，视频编码支持H.264，H.265，音频支持AAC，支持TCP/UDP协议，是一套极佳的且适合用于综合安防视频云服务播放组件，已经非常稳定、完整。功能包括：直播、录像、抓图，目前在功能性、稳定性、可扩展性和完整性极强的一款H5播放器！

随着不断的发展和迭代，不断基于成功的实践经验，支持Windows、 Android、iOS平台。

SkeyeWebPlayer.js H5播放器如何实现？

Flv.js 是 HTML5 Flash 视频（FLV）播放器，纯原生 JavaScript 开发，没有用到 Flash。由 bilibili 网站开源。 该项目依托于 Media Source Extensions。

实现了在 HTML5 视频中播放 FLV 格式视频的 JavaScript 库。它的工作原理是将 FLV 文件流转码复用成 ISO BMFF（MP4 碎片）片段，然后通过 Media Source Extensions 将 MP4 片段喂进浏览器。

SkeyeWebPlayer.js H5播放器功能：

• 具有 H.264 + AAC 编解码器播放功能
• HTTP FLV RTSP低延迟实时流播放 (HLS延时稍大一点，大概在1s—2s左右)
• WS-FLV 通过 WebSocket 实时流播放
• 兼容 Chrome, FireFox, Safari 10, IE11 和 Edge
• 十分低开销，并且通过你的浏览器进行硬件加速

SkeyeWebPlayer.js H5播放器依赖的浏览器特性兼容列表

• HTML5 Video
• Media Source Extensions
• WebSocket
• HTTP FLV: fetch 或 stream
• canvas：H265

SkeyeWebPlayer.js 累积延过大时,跳帧播放问题

可以设置一个定时器指定时间跳帧, 时间不可过大或过小,容易造成卡顿和画面衔接过于突兀。

setInterval(() => {
  let buffered = this.Player.buffered;
  if (buffered.length > 0) {
    let end = buffered.end(0);
    if (end - this.Player.currentTime > 0.2) {
      this.Player.currentTime = end - 0.1;
    }
  }
}, 2 * 1000);