我找到了 this great page显示如何流式传输视频。
他的代码假设onmessage
数据是jpg
这样的
ws.onmessage = function (e) {
$("#image").attr('src', 'data:image/jpg;base64,'+e.data);
}
但我也想要音频和其他页面数据。
如何让WebSockets解析消息类型和二进制类型?
最佳答案
Websocket 消息中的数据可以是字符串(文本消息)或二进制数据。在您的情况下,它是字符串数据,其中字符串内容是二进制图像的 base64 编码。 在更好的优化程序中,图像也可以二进制传输。
根据消息类型,e.data 将是另一种类型。
- 如果消息是文本消息,则 e.data 将是字符串类型。
- 如果消息是二进制消息,则 e.data 将包含
ArrayBuffer
或Blob
对象。您可以通过设置WebSocket.binaryType
属性(例如"arraybuffer"
)自行决定要接收哪种二进制数据表示形式。
您可以使用 instanceof
来检查您是否收到了二进制或文本消息。
如果你想传输不同类型的二进制数据,你可以在消息的开头使用一个标题来告诉客户端消息包含什么。例如。将二进制数据的第一个字节声明为 header 。如果第一个字节包含 1,则剩余数据是图片,如果第一个字节包含 2,则剩余数据是短音频样本,依此类推。 但是,由于您需要拆分或组合二进制数据数组,所以这对双方来说都有点困难。
或者,您可以在客户端和服务器之间使用多个并行的 websocket 连接。一个用于视频数据,一个用于音频数据,一个用于一般消息等。
关于javascript - 如何解析数据和二进制 websocket 消息?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19322635/