uniapp中后端返回流 前端分片播放视频

在uniApp开发中，如果后端服务器返回的是视频流数据，前端想要实现分片播放视频，通常会采用以下步骤：

1. **接收流数据**：后端通过HTTP流（如MIME类型 `video/mp4` 或 `application/octet-stream`）发送视频数据。前端可以使用uni-app提供的网络请求API（如`fetch`或`wx.request`），设置 responseType 为 'blob' 来接收二进制流数据。

uni.request({
   url: 'your-endpoint-url',
   method: 'GET',
   responseType: 'blob',
   success(res) {
      let videoBlob = res.data;
      // 进行后续处理
   }
})

2. **文件切片**：由于浏览器一次只能加载一小部分数据，我们需要将大视频切成小块（分片）。这可以通过JavaScript的`ArrayBuffer`、`Uint8Array`等处理二进制数据的方式来进行。

3. **创建MediaSource和MediaSourceEngine**：创建一个`MediaSource`对象，并将其附加到`MediaSourceEngine`上，然后添加媒体段到`MediaSource`。

let mediaSource = new MediaSource();
let mediaSourceEngine = mediaSource.createMediaSourceEngine();
mediaSourceEngine.addEventListener('sourceopen', () => {
   let segment = sliceVideoBlobIntoSegments(videoBlob);
   addSegmentToMediaSource(mediaSource, segment);
});

4. **创建MediaElement和TextTrack**：创建HTML5的`<video>`元素，设置其源为MediaSource生成的URL，同时可能需要创建一个`TextTrack`用于字幕。

5. **播放分片**：设置`<video>`的`src`属性为`MediaSource`的URL并开始播放。当`sourceopen`事件触发，新视频数据就会自动播放。

6. **错误处理**：处理可能出现的数据中断、网络问题等，确保视频播放的连续性。