javascript - 为什么 JS 客户端不从服务器接收二进制文件?

标签 javascript websocket crystal-lang

服务器( Crystal )

require "http"

module Network
    class WebSocket < HTTP::WebSocketHandler
        HANDLERS = [] of HTTP::Handler
        def initialize (@path : String, &@proc : HTTP::WebSocket, HTTP::Server::Context -> Nil)
            HANDLERS << self
        end

        def self.run (host : String = "::", port : Int32 = 3030)
            puts "Run server on ws://[#{host}]:#{port}"
            HTTP::Server.new(host, port, HANDLERS).listen
        end
    end
end

Network::WebSocket.new "/" do |socket|
    socket.send("Hello From Binary!".to_slice)
end

Network::WebSocket.run

客户端(JavaScript)

ws = new WebSocket("ws://[2a01:4f8:xx:xx::xx]:3030/")
ws.onmessage = (message) => {
    console.log(message.data)
}

Console.log show me ArrayBuffer(13) with byte length and without any payload.

但是! Python 客户端 ( https://github.com/websocket-client/websocket-client ) 工作正常。

from websocket import create_connection
ws = create_connection("ws://[::]:3030")
print("Receiving...")
result =  ws.recv()
print("Received '%s'" % result)
ws.close()

二进制接收在 chromium 和 firefox 中不起作用。

最佳答案

在客户端使用 ws.binaryType = "arraybuffer" 并将其转换为 Uint8Array:

new Uint8Array(message.data) // => [72, 101, 108, 108, 111, 32, 70, 114, 111, 109, 32, 66, 105, 110, 97, 114, 121, 33]

匹配从 Crystal 服务器发送的字节数组:

"Hello From Binary!".to_slice # => Bytes[72, 101, 108, 108, 111, 32, 70, 114, 111, 109, 32, 66, 105, 110, 97, 114, 121, 33]

关于javascript - 为什么 JS 客户端不从服务器接收二进制文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47531467/

相关文章:

javascript - 如何让标题随着图片一起移动?

java - tomcat在运行部署的war文件时产生异常

websocket - WebSocket 握手期间出现间歇性错误 : Unexpected response code: 400 on CloudBees

javascript - javascript中如何让函数同步执行?或者如何让函数依次执行?

javascript - javascript 中的生成器函数

java - 如何在 Play 的 2.0 WebSocket 中验证用户身份?

crystal-lang - 如何在 C 绑定(bind)中拥有数组类型?

crystal-lang - Crystal 中的异常和错误

return-type - 是否有可能获得要在宏中使用的方法调用的推断返回类型?

javascript - XHR 无法加载 <URL>。请求的资源上不存在 'Access-Control-Allow-Origin' header