ajax img src如何索引,使用jQuery的ajax方法作为blob检索图像

小编典典

您不能使用jQuery ajax来执行此操作，而是使用本机XMLHttpRequest来执行此操作。

var xhr = new XMLHttpRequest();

xhr.onreadystatechange = function(){

if (this.readyState == 4 && this.status == 200){

//this.response is what you're looking for

handler(this.response);

console.log(this.response, typeof this.response);

var img = document.getElementById('img');

var url = window.URL || window.webkitURL;

img.src = url.createObjectURL(this.response);

}

}

xhr.open('GET', 'http://jsfiddle.net/img/logo.png');

xhr.responseType = 'blob';

xhr.send();

编辑

因此，回顾这个​​主题，似乎确实有可能使用jQuery 3做到这一点。

jQuery.ajax({

url:'https://images.unsplash.com/photo-1465101108990-e5eac17cf76d?ixlib=rb-0.3.5&q=85&fm=jpg&crop=entropy&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ%3D%3D&s=471ae675a6140db97fea32b55781479e',

cache:false,

xhr:function(){// Seems like the only way to get access to the xhr object

var xhr = new XMLHttpRequest();

xhr.responseType= 'blob'

return xhr;

},

success: function(data){

var img = document.getElementById('img');

var url = window.URL || window.webkitURL;

img.src = url.createObjectURL(data);

},

error:function(){

}

});

要么

使用xhrFields设置responseType

jQuery.ajax({

url:'https://images.unsplash.com/photo-1465101108990-e5eac17cf76d?ixlib=rb-0.3.5&q=85&fm=jpg&crop=entropy&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ%3D%3D&s=471ae675a6140db97fea32b55781479e',

cache:false,

xhrFields:{

responseType: 'blob'

},

success: function(data){

var img = document.getElementById('img');

var url = window.URL || window.webkitURL;

img.src = url.createObjectURL(data);

},

error:function(){

}

});

2020-04-25