Question

我通过jQuery AJAX请求从我的http服务器请求图像（image/jpeg或image/png）：

$.ajax({
     'url': '/my/cool/api/server',
     'contentType': 'application/json',
     'data': '{"some":1,"cool":2,"request":3,"data":4}',
     'type': 'POST'
}).done(function(data) {
    // what to do here?
});

服务器确实返回了正确的图像。我想使用img语法在src=data:image/png;base64,...标记中显示返回的图像。我不希望服务器将图像包装在base64中，所以我需要通过Javascript在webbrowser中完成。我该怎么做呢？回调中的data变量似乎以某种方式被破坏了。我可以让jQuery为我返回原始图像字节吗？或者让jQuery在base64中为我编码数据？

我已经有了一个工作的香草JS版本，因此我原则上知道尼特是可能的。我正在寻找这个工作的香草JS代码的工作jQuery变体：

var xhr = new XMLHttpRequest();
xhr.open('GET', '/my/cool/api/server', true);
xhr.responseType = 'arraybuffer';
xhr.onload = function(e) {
    var arr = new Uint8Array(this.response);
    var raw = String.fromCharCode.apply(null, arr);
    var b64 = window.btoa(raw);
    var imgElem = document.getElementById('TODOImg');
    imgElem.src = 'data:image/jpeg;base64,' + b64;
};
xhr.send();

Answer 1

如果你想做你已经完成的事情，但是使用jQuery，你或多或少都在那里。

在jQuery的“完成”功能中，您完全按照本机XHR请求的“onload”功能执行操作。

但是，jQuery的ajax并不真正支持二进制数据，因此您可能需要将二进制传输插入其中 - 请参阅http://www.henryalgus.com/reading-binary-files-using-jquery-ajax。

通过jQuery AJAX接收图像并在没有服务器base64编码图像的情况下显示图像

1 个答案: