在Javascript中将图片转换为二进制数据或字符串

Question

我正在使用 XMLHttp 请求在 Chrome 扩展程序中上传图像文件到 TWITPIC。我需要将图像作为负载发送。有什么方法可以做到这一点吗？我发现了这个链接 将图像转换为二进制数据的 JavaScript 代码，但它只适用于图像标签。我需要一种指定图像文件路径并上传图像到 TWITPIC 的方法。

我知道 HTML5 中有一个 FileReader API。有没有办法使用它来完成这项工作？它应该适用于本地文件。

Chrome 扩展是否支持 FileReader API 而无需运行本地主机服务器？

- Ram

Answer 1

我自己找到了答案。Chrome扩展支持HTML5的FileReader API。所以只需使用以下简单代码即可。

  var reader = new FileReader();
  reader.readAsDataURL(f);

- Ram

---

这段代码将文件进行base64编码，但这会使文件的大小增加约33%，而且可能不是问题，但还是值得考虑。使用readAsBinaryString(f)可以将文件作为二进制数据返回，但似乎不兼容IE10。 - Josh

Answer 2

您可以使用XMLHTTPRequests获取图像的二进制数据，我最近就是为了类似的目的而使用它：

var dataToBinary = function(data){
    var data_string = "";
    for(var i=0; i<data.length; i++){
        data_string += String.fromCharCode(data[i].charCodeAt(0) & 0xff);
    }
    return data_string;
};

$.ajax("http://some.site.com/myImage.jpg", {
    success: function(data){
        binary = dataToBinary(data);
        //or: 'binary = data', dataToBinary might not be needed
    },
    mimeType: "text/plain; charset=x-user-defined"
});

二进制数据存储在变量binary中。

- mattsven