Question

当我的浏览器从网站下载图像时，不涉及base64编码。它发出一个HTTP命令，如GET /image.jpg，并收到一个HTTP响应，其Content-Type类似于image/jpg，其Content-Length是图像中的字节数，其主体是原始二进制图像数据本身。数据既不使用字符集编码，也不使用base64等编码进行编码。

编写RESTful资源已经训练我期望HTTP GET和PUT之间的对称性，例如，当我执行GET时，传递JSON数据的URL将接受JSON数据显示为PUT时。在任何情况下都不涉及表格编码;在这两种情况下，只有一个Content-Length给出有效载荷中的字节数，一个Content-Type标头声明有效载荷是某个字符集中的JSON，然后字符数据单独存在并且作为GET或PUT的正文。

我正在编写一个PhoneGap应用程序，让用户可以拍照并使用我的应用程序上传照片。我原本以为我可以为此设计一个RESTful接口，支持对称GET和PUT - 这样PUT命令不涉及特殊编码，也不涉及字符集的任何想法，但只需要Content-Type image/jpg，然后将大量二进制JPG数据作为其有效负载。显然，这比尝试对表单内的图像进行编码更有效地使用带宽。当我使用PUT等工具curl到网址时，此方法可以正常工作。

但是我没有运气从PhoneGap WebKit JavaScript做一个干净的RESTful PUT！ PhoneGap愿意将图片作为本地file:网址返回给我的JavaScript，或者作为data:网址将图片数据作为内容提供给base64编码。但在这两种情况下，我都无法找到将图像转换为纯二进制格式的明确方法（我会使用其中一个新的Blob对象吗？如果是这样，怎么做？）然后导致{{1}如果没有使用额外的表单层或编码段来装饰请求，只需将原始图像通过线路传输到我的Web服务器作为HTTP请求有效负载。

有没有人知道如何将原始图像作为身体引导WebKit到PUT一个AJAX请求？感谢任何指针 - 甚至任何有用的答案，我接近这一切都错了！

Answer 1

对于二进制图像处理，Binary File Inspector demo可能有助于作为端到端示例。

有一些关于从MDN的文件系统获取Blob的主题的教程信息。 This blog post介绍了如何将base64 URI转换为ArrayBuffer，然后转换为Blob。

最后，可以上传ArrayBuffer或Blob using the XMLHttpRequest2 interface。

支持PUT的

The XHR2 spec seems to imply以及一堆其他HTTP方法。因此，结合所有这些，您可以填充Blob中的文件并使用XHR2发送它们。

在base64-binary.js的帮助下使用base64解码方法的未经测试的代码示例：

var BASE_64_PREFIX = "base64,";
function getBase64Content(base64Uri) {
   var index = base64Uri.indexOf(BASE_64_PREFIX);
   return base64Uri.substring(index + BASE_64_PREFIX.length);
}

function put(uri, data, onComplete) {
    var xhr = new XMLHttpRequest();
    xhr.open("PUT", uri, true);
    xhr.onload = onComplete;

    xhr.send(data);
}

var base64Uri = fromPhoneGap();
var base64Content = getBase64Content(base64Uri);
var arrayBuffer = Base64Binary.decodeArrayBuffer(base64Content);

put("/some/uri", arrayBuffer, function () {
    console.log("All done");
});

也就是说，我怀疑这部分甚至可以用于最新的桌面WebKit，更不用说你将通过PhoneGap背负的版本了。你可能没有很好地利用这些草案规范。

Webkit JavaScript PUT或POST图像REST样式可以作为纯二进制吗？

1 个答案: