vue3 websocket 获取 265 flv 播放

Vue3 中使用 WebSocket 与服务器通信获取 FLV（Flash Video）流并在前端播放，通常涉及以下几个步骤：

1. **建立WebSocket连接**：
首先，你需要安装 Vue 的 WebSocket 插件，如 `vue-websocket` 或 `vue-socket.io-client`，并配置它与服务器端的 WebSocket 服务连接。例如，通过 `Vue.prototype.$http = new VueSocketIO('wss://your-server.com')`。

2. **接收数据**：
当从服务器接收到二进制的 FLV 数据时，比如是一个 `Blob` 对象，需要处理这个特殊的类型。你可以创建一个事件监听器来接收和解码这些数据。

this.$http.on('streamData', (data) => {
  let blob = new Blob([data], { type: 'video/x-flv' });
  handleFlvBlob(blob);
});

3. **解码和播放**：
使用 HTML5 的 `URL.createObjectURL()` 将 Blob 转换为 URL，然后将 URL 传递给一个支持播放 FLV 格式视频的标签，如 `HTMLVideoElement`。这一步可能需要一个 Flash 或者第三方库来解析和播放 FLV 文件，因为浏览器原生对FLV的支持有限。

function handleFlvBlob(blob) {
  const url = URL.createObjectURL(blob);
  const video = document.getElementById('your-video-id');
  video.src = url;
}