javascript - 使用牛仔和 MessagePack 通过 websocket 发送二进制数据

Question

我正在尝试通过 WebSocket 从 Cowboy 向浏览器发送 MessagePack 编码的消息，但接收到的数据始终为空或无效。我能够将二进制数据从 JS 发送到我的牛仔处理程序，但反之则不行。我正在使用带有官方msgpack-erlang应用程序的 Cowboy 1.0.4。我也msgpack-lite用于我的浏览器内 javascript。

例子：

websocket_handler：

websocket_handle({text, <<"return encoded">>}, Req, State) ->
    %% sends encoded message to client. Client is unable to decode and fails
    {reply, {binary, msgpack:pack(<<"message">>)}, Req, State};
websocket_handle({binary, Encoded}, Req, State) ->
    %% Works as expected
    lager:info("Received encoded message: ~p", [msgpack:unpack(Encoded)]),
    {ok, Req, State};

JS：

var host = "ws://" + window.location.host + "/websocket";
window.socket = new WebSocket(host);
socket.binaryType = 'arraybuffer';
socket.onmessage = function(event) {
    var message = msgpack.decode(event.data);
    console.log(message);
};

浏览器在 msgpack.min.js 中返回错误：

Error: Invalid type: undefined
...ion n(t){var r=i(t),e=f[r];if(!e)throw new Error("Invalid type: "+(r?"0x"+r.toSt...

如果我尝试将原始 event.data 输出到控制台，这就是我得到的：

 ArrayBuffer {}

由于某种原因，它似乎是空的。我对erlang和都是新手msgpack，不知道出了什么问题。谢谢你的帮助！

Answer 1

Found the reason of my problem. The way how I tried to decode message on the client was wrong:

socket.onmessage = function(event) {
  var message = msgpack.decode(event.data);
  console.log(message);
};

The right way:

socket.onmessage = function(event) {
    var raw_binary_data = new Uint8Array(event.data);
    var message = msgpack.decode(raw_binary_data);
    console.log(message);
};

Answer 2

Using Uint8Array is a valid solution for client side issue. On server to pack strings use:

msgpack:pack(<<"message">>,[{pack_str,from_binary}])

Source : Article

Answer 3

好像msgpack-lite不支持二进制类型。尝试将您的数据打包为字符串。

{binary, msgpack:pack("message", [{enable_str, true}])}