html – 如何将png二进制数据放入img标签并将其显示为图像？

概述我正在使用这个 $.ajax({ type: "GET", url: 'template/bump1/purse.png', datatype:"image/png", success: function (data) { var reader = new FileR 我正在使用这个

$.@R_502_6815@({            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开头,但不显示图像…

@H_301_25@解决方法 jquery @R_502_6815@不支持二进制响应( 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();

总结

以上是内存溢出为你收集整理的html – 如何将png二进制数据放入img标签并将其显示为图像？全部内容，希望文章能够帮你解决html – 如何将png二进制数据放入img标签并将其显示为图像？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。