在 Javascript 中通过 Web 套接字发送和接收二进制数据？

Question

是否可以通过 JavaScript 中的 Web 套接字发送和接收二进制数据？例如，我可以使用 Web 套接字实现 SSH 客户端吗？

Answer 1

的下一个草案 (hybi-07) WebSockets 规范正在大多数浏览器中实现，它将为协议和 API 添加内置的二进制支持。

然而，在此之前，WebSockets 有效负载被编码为 UTF-8。为了发送二进制数据，您必须使用某种方式将二进制数据编码为 UTF-8。

有很多选项，但这里有两个我使用过的：

UTF-8：

实际上，您可以将字节流直接编码为 UTF-8。

用于编码和解码的 python 看起来像这样：

from codecs import (utf_8_encode, utf_8_decode,
                    latin_1_encode, latin_1_decode)

utf_8_encode(unicode(buf, 'latin-1'))[0]      # encode

latin_1_encode(utf_8_decode(utf8_buf)[0])[0]  # decode

在 Javascript 中：

chr = data.charCodeAt(N)  // to 'decode' at position N of the message

// Enocde array of bytes (0-255) to UTF-8
data = array.map(function (num) {
    return String.fromCharCode(num); }).join('');

UTF-8 编码注释：

• 对于在值 0-255 之间均匀分布的二进制数据，则有效负载的大小比原始二进制文件大 50%数据。

• Flash WebSockets 模拟器 web-socket-js 可能存在编码问题0（零）。

Base 64：

在Python中：

from base64 import b64encode, b64decode

data = b64encode(buf)    # encode binary buffer to b64

buf = b64decode(data)    # decode b64 to binary buffer

在Javascript端对消息进行编码和解码：

data = window.btoa(msg)  // Encode to base64

msg = window.atob(data)  // Decode base64
msg.charCodeAt(N)        // Read decode byte at N

Base 64注释：

• 均匀分布的二进制数据（0-255）将比原始数据大33％。

• base64 编码的 Python 端开销比 UTF-8 编码少。然而，解码 Base64 时 Javascript 端的开销会多一点（UTF-8 不需要在 Javascript 中解码，因为浏览器已经将 UTF-8 转换为 Javascript 原生 UTF-16）。

• 更新：假设二进制数据被编码为 UTF-8 字符串，如上所示，字符值范围为 0-255。具体来说，window.atob 不支持超过 255 的字符值。请参阅此 mozilla bug。同样的限制也适用于 Chrome。

websockify：

WebSockify 是一个代理/桥接器，允许支持 WebSockets 的浏览器与任意二进制服务通信。它的创建是为了允许 noVNC 与现有的 VNC 服务器进行通信。 websockify 使用二进制数据的 base64 编码/解码，还提供了一个用于 Javascript 的 websock.js 库。 websock.js 具有与常规 WebSocket 类似的 API，但它透明地处理二进制数据，并且旨在与 websockify 进行通信。 免责声明：我创建了 websockify 和 noVNC。

ssh 客户端：

从技术上讲，您可以通过 WebSocket 实现浏览器 ssh 客户端（我已经考虑过），但是，这需要在浏览器中进行 SSH 加密和解密，这会很慢。鉴于 WebSockets 具有加密的 WSS (TLS) 模式，因此通过 WebSocket WSS 进行普通 telnet 可能更有意义。

事实上，websockify 包含一个示例 telnet 客户端。

您可以像这样在 HOSTNAME 上启动 websockify（telnetd 来自 krb5-telnetd）：

sudo ./websockify 2023 --web . --wrap-mode=respawn -- telnetd -debug 2023

然后导航到 http://HOSTNAME:2023/wstelnet.html?hostname=HOSTNAME&port=2023

请参阅 websockify 自述文件 了解更多信息。要使用 WSS 加密，您需要创建 SSL 密钥，如 noVNC 高级使用 wiki 中所述页面

Answer 2

现在您可以轻松地发送和接收二进制数据，本文解释了很多想法：http://blog.mgechev.com/2015/02/06/parsing-binary-protocol-data-javascript-typedarrays-blobs/

这是我接收二进制 numpy 的方式在浏览器中使用 python (my_nparray.tobytes()) 发送的数组：

ws = new WebSocket("ws://localhost:51234");
ws.binaryType = 'blob';
var buffer;

ws.onmessage = function (evt) {
    var reader = new FileReader();
    reader.readAsArrayBuffer(evt.data);
    reader.addEventListener("loadend", function(e)
    {
        buffer = new Uint16Array(e.target.result);  // arraybuffer object
    });
};

您可以使用以下方法将类型化数组转换为 javascript 数组：

Array.prototype.slice.call(buffer.slice());

Answer 3

发送和接收二进制数据的一种良好且安全的方法是使用 base64 或 base128（其中 128 只有 1/7 的开销，而不是 1/3）。

是的，可以使用 SSH 客户端。

证明这一点的一个证据是，已经有很多在常见浏览器中运行的解决方案，但其中大多数仍然需要自定义服务器端实现。
您可以在此处查看更多信息：http://en.wikipedia.org/wiki/Web-based_SSH

Answer 4

嗯，也许 WebSockets 可以以某种方式与此结合： http://ie.microsoft.com/testdrive /HTML5/TypedArrays/

Answer 5

如果没有充当 SSH 客户端或某种 WebSocket 到 SSH 代理的 Web 服务器的帮助，您无法使用 WebSocket 在浏览器中实现 SSH 客户端。

WebSocket 协议允许发送任意二进制数据（甚至不是 UTF-8 或 Base-64 编码），但该数据封装在其格式由 WebSocket 协议定义的帧中（请参阅 RFC6455），与 SSH 协议无关。这种封装被 Web 浏览器端的 Javascript 隐藏，但接收 WebSocket 连接的服务器接收它并且也必须实现它，以便可以建立连接。

因此，可以将 SSH 协议作为 WebSocket 协议的有效负载进行交换，但不能实现标准的 SSH 客户端。