2

我有一个 POST 请求将图像作为 gif 返回。据我所知，响应不是 base64 编码的文本。那么如何将图像分配给 img 的 src 标签？

我说它不是base64编码的原因是我试图使用它来显示它data:image/gif;base64,"+ data，这给我没有结果。

然后我尝试使用 jquery.base64 插件对响应进行编码（但抱怨无效字符）；

响应文本在 fiddler 中看起来像下面的“GIF87a��”，查看响应文本视图。图像视图可以很好地显示图像。

我也无权访问服务器来告诉它以 base64 返回。

任何想法或帮助将不胜感激，也许它是如此简单我错过了它。

提前致谢。

4

2 回答 2

5

这是完全可能的：

这是示例：

var req = new XMLHttpRequest;
req.overrideMimeType('text/plain; charset=x-user-defined');
req.open('GET', "http://jonathanleighton.com/images/me.jpg", !1);
req.send(null);
for (var responseText = req.responseText, responseTextLen = responseText.length, binary = "", i = 0; i < responseTextLen; ++i) {
  binary += String.fromCharCode(responseText.charCodeAt(i) & 255)
}
image.src = 'data:image/jpeg;base64,'+window.btoa(binary);

这是来自 Internet 的示例，但确认它有效。'POST' 应该以完全相同的方式工作。

于 2013-02-06T20:22:48.323 回答
1

感谢@xchg.ca 的回答，我能够通过 jquery ajax 调用来做到这一点：

$.ajax({
  type: "GET",
  url: "imageURL",
  beforeSend: function (xhr) {
    xhr.overrideMimeType('text/plain; charset=x-user-defined');
  },
  success: function (result, textStatus, jqXHR) {       
    if(result.length < 1){
        alert("The thumbnail doesn't exist");
        $("#thumbnail").attr("src", "data:image/png;base64,");
        return
    }

    var binary = "";
    var responseText = jqXHR.responseText;
    var responseTextLen = responseText.length;

    for ( i = 0; i < responseTextLen; i++ ) {
        binary += String.fromCharCode(responseText.charCodeAt(i) & 255)
    }
    $("#thumbnail").attr("src", "data:image/png;base64,"+btoa(binary));
  },
  error: function(xhr, textStatus, errorThrown){
    alert("Error in getting document "+textStatus);
  } 
});
于 2015-02-05T08:17:19.570 回答