HTML视频部分加载：寻求尚未加载的时间会冻结播放器并从头开始重播

问题描述

尝试将我们的NodeJS服务器设置为接受部分加载，以使用HTML元素进行媒体流传输。添加此功能是为了使正在运行的视频能够进行擦洗/搜索，但是我遇到了一个有趣的问题，但我一直无法找到解决方案。

这是确定字节范围的代码：

function getRequestRange(range: string,fileSize: number): {
  start?: number,end?: number
} {
  const result: {
    start?: number,end?: number
  } = {}

  const [start,end] = range.replace(/bytes=/,'').split('-')
  let byteStart: number,byteEnd: number

  result.start = parseInt(start,10)
  result.end = end ? parseInt(end,10) : fileSize - 1

  if (!isNaN(byteStart) && isNaN(byteEnd)) {
    result.end = fileSize - 1
  }

  if (isNaN(byteStart) && !isNaN(byteEnd)) {
    result.start = fileSize - byteEnd
  }

  if (result.start >= fileSize || result.end >= fileSize) {
    throw { error: rangeError,fileSize }
  }

  return result
}

它生成的标头：

{
    headers['Content-Range'] = `bytes ${byterange.start}-${byterange.end}/${size}`
    headers['Accept-Ranges'] = 'bytes'
    headers['Content-Length'] = byterange.end - byterange.start + 1
}

这将在“网络”标签中返回206，以进行部分加载，我可以对此进行验证。但是，当我尝试寻找尚未加载的时间时，视频会从头开始重新播放，并在加载至尝试加载其他时间之前的时间点冻结。

HTML Video元素：

<video
    autoplay="true"
    controls="true"
    onLoadedMetadata={handleVideoLength}
>

为了保护数据，服务器被设置为通过来自不同服务的API通过我们的API代理媒体流，该服务可以访问存储内容的AWS S3。

您知道为什么在尝试搜索尚未加载的时间时视频会冻结吗？我对部分加载的理解是，它会请求通过查找时间指定的块，然后向服务器发送另一个请求以获取该信息。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

html video video video-streaming