如何在纯 JavaScript 中发送二进制数据？

Question

我想通过 JavaScript 将二进制数据从 html 页面发送到我的服务器，但服务器收到的字节不同。接收到的字节似乎被转换为 unicode 字符串，请参见以下示例：

xhr.open('POST', '/check', true);
xhr.setRequestHeader('cache-control', 'no-cache');
xhr.setRequestHeader('Content-Type', 'application/octet-stream');
xhr.send('\x41\xFE\x80');

服务器应该收到“Aþ€”，但它得到了A݀。

我测试了很多东西，比如：

//xhr.overrideMimeType('text/plain; charset=iso-8859-1');
//xhr.setRequestHeader('Content-type', 'text/plain; charset=iso-8859-1');
//xhr.setRequestHeader('Content-type', 'application/xml; charset=UTF-8');
//xhr.overrideMimeType('text/plain; charset=x-user-defined');
//xhr.overrideMimeType('text\/plain; charset=x-user-defined');

在服务器端我运行 plackup (http://localhost:5000/index.html)，$env->{'CONTENT_LENGTH'} 是 5，所以服务器似乎真的得到了 5 个字节 A݀。

任何提示如何接收原始二进制数据都会很棒。

Answer 1

恕我直言，我的 Javascript 是正确的

事实并非如此。正如我在评论中所暗示的，对二进制数据使用Uint8Array，而不是字符串：

xhr.send(new Uint8Array([0x41, 0xFE, 0x80]));

如果你已经有一个字符串......这应该可以工作：

xhr.send(new Uint8Array(Array.from('\x41\xFE\x80').map(x => x.charCodeAt(0)))

解释：spec for send 说：

如果body 是Document，则将请求正文设置为body、序列化、转换为Unicode 和UTF-8 编码。

否则，将请求正文和extractedContentType设置为提取body的结果。

String 不是Document，因此第一个选项不适用。 “提取”的定义见fetch spec：

USVString:

将action 设置为在object 上运行UTF-8 编码的操作。

将Content-Type 设置为text/plain;charset=UTF-8。

将source 设置为object。

你可以看到你的字符串的 UTF-8 编码是怎样的：

new TextEncoder().encode('\x41\xFE\x80')
// => Uint8Array(5) [65, 195, 190, 194, 128]