我正在使用这个
$.ajax({
type: "GET",url: 'template/bump1/purse.png',datatype:"image/png",success: function (data) {
var reader = new FileReader();
reader.onload = function (e) {
var img = document.getElementById("CaptchaImg");
img.src = e.target.result;
};
reader.readAsDataURL(data);
//$('#CaptchaImg').attr('src',data);
}
});
下载图像,它以二进制形式出现,看起来像这样
node.js将其返回为
WriteHeaderMode('image/png',res,200);
res.end(data,'binary');
但现在,我如何将其放入图像标记并将其显示为图像.注意：我不想将返回数据作为base64编码,它必须是二进制的.我很好,在客户端将二进制文件转换为base64.
当我将它传递给readAsDataURL时,它会显示TypeError异常.
谢谢
编辑
var img = document.getElementById("CaptchaImg");
var reader = new FileReader();
reader.onload = function(e) {
//img.src = e.target.result;
$("body").html(e.target.result);
};
reader.readAsDataURL(new Blob([data]));
这似乎将它转换为base64编码,它以data：application / octet-stream; base64开头,但不显示图像…
解决方法
jQuery Ajax不支持二进制响应(
okay now it does),有一个技巧使用overrideMimeType(‘text / plain; charset = x-user-defined’)将每个字节作为响应字符串中的字符返回,然后循环遍历响应创建数据的字节数组.
但是使用裸露的XMLHttpRequest,可以使用responseType属性轻松完成.
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if (this.readyState == 4 && this.status == 200){
var img = document.getElementById("CaptchaImg");
var url = window.URL || window.webkitURL;
img.src = url.createObjectURL(this.response);
}
}
xhr.open('GET','template/bump1/purse.png');
xhr.responseType = 'blob';
xhr.send();
