使用纯 JavaScript 上传二进制文件

Upload a binary file using pure JavaScript

本文关键字:二进制文件 JavaScript      更新时间:2023-09-26

我正在开发一个使用HTML5文件系统API的Chrome应用程序,并允许用户导入和同步文件。 我遇到的一个问题是,如果用户尝试同步图像文件,则文件在上传到服务器的过程中会损坏。 我假设这是因为它们是二进制的。

对于上传,我选择只发出Ajax POST请求(使用MooTools),然后将文件内容作为请求的正文。 我告诉MooTools关闭urlEncode并将字符集设置为"x-user-defined"(不确定是否有必要,我只是在一些网站上看到了它)。

鉴于Chrome不支持xhr.sendAsBinary,是否有人有任何示例代码允许我通过Ajax发送二进制文件?

FF的xhr.sendAsBinary()不是标准的。XHR2 支持发送文件(xhr.send(file))和 blob (xhr.send(blob)):

function upload(blobOrFile) {
  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/server', true);
  xhr.onload = function(e) { ... };
  // Listen to the upload progress.
  xhr.upload.onprogress = function(e) { ... };
  xhr.send(blobOrFile);
}

您也可以发送ArrayBuffer

如果你正在编写服务器,那么你可以将你读取的字节转换为纯文本,将其发送到服务器,然后将其解码回来。

这是最简单的方法(不是很有效,但这只是为了展示技术)-

将从文件中读取的每个字节转换为两个十六进制字符的字符串。如果您读取字节 53(十进制),则将其转换为"45"(53 的十六进制表示形式)。将所有这些字符串连接在一起,并将生成的字符串发送到服务器。

在服务器端,在偶数位置上断开字符串,将每对数字转换为一个字节。