html 显示 二进制jpeg图像
做了个简单的socket.io服务器,以不断推送图片的方式进行“直播”
那么后端是把图片以jpeg编码成二进制格式,直接emit
前端该如何显示? 搞了半天还是半懂不懂的,但是凑合搞定了。
<body> <img id="player" style="width:704px;height:576px"/> </body>
首先,接收到的是个arrayBuffer
关键是通过 arrayBuffer -> 转 base64,
参考
https://blog.csdn.net/weixin_30906425/article/details/99002648
function arrayBufferToBase64(buffer) { var binary = ''; var bytes = new Uint8Array(buffer); var len = bytes.byteLength; for (var i = 0; i < len; i++) { binary += String.fromCharCode(bytes[i]); } return window.btoa(binary); }
然后<img> .src 就可以显示了
var player = document.getElementById('player'); var url= arrayBufferToBase64(data); player.src='data:image/jpeg;base64,'+url;
—————————————