vue.js - 兄弟们，web端有没有好的h264播放器可以播放字节码的？

Question

我通过websocket 已经将拿到了实时的h264的base64，并且转出来了二进制

该如何在前端播放

Answer 1

都拿到字节流了，理论上你把它转成blob对象就可以在video标签下播放了，see: https://stackoverflow.com/questions/14317179/display-a-video-from-a-blob-javascript

Answer 2

在前端播放H264字节码（base64编码的二进制数据）可以使用一些特定的视频播放库来实现。下面是一种可能的解决方案，使用JavaScript和HTML5的video标签。

首先，你需要将收到的base64编码的二进制数据解码为二进制数据。你可以使用浏览器的内置函数atob()将base64字符串解码为二进制字符串，然后将这个字符串转换为ArrayBuffer。

let base64String = "你的base64字符串"; // 你的base64字符串let binaryString = atob(base64String);let bytes = new Uint8Array(binaryString.length);for(let i = 0; i < binaryString.length; i++) {    bytes[i] = binaryString.charCodeAt(i);}

然后，你需要创建一个Blob对象，并使用URL.createObjectURL()方法创建一个表示这个Blob的URL。

let blob = new Blob([bytes], {type: 'video/mp4'});let url = URL.createObjectURL(blob);

最后，你可以创建一个video元素，设置src属性为这个URL，然后就可以开始播放视频了。

<video id="videoElement"></video><script>    let videoElement = document.getElementById('videoElement');    videoElement.src = url;    videoElement.play();</script>

请注意，这种方法需要浏览器支持MP4格式的视频。另外，由于WebSocket是单向的，你可能需要在服务器端进行H264到MP4的转换，或者在客户端使用一些专门的库来进行转换。