Maison >interface Web >js tutoriel >Comment récupérer des images sous forme de blobs à l'aide de la méthode AJAX de jQuery ?

Comment récupérer des images sous forme de blobs à l'aide de la méthode AJAX de jQuery ?

Barbara Streisand
Barbara Streisandoriginal
2024-11-12 13:36:02221parcourir

How to Retrieve Images as Blobs Using jQuery's AJAX Method?

Récupérer des images sous forme de blobs à l'aide de la méthode AJAX de jQuery

La récupération d'images sous forme de blobs à l'aide de la méthode AJAX de jQuery n'est pas directement prise en charge, car les types de données acceptés n'incluent pas les formats d'image. Cette inadéquation entraîne souvent des images corrompues.

Pour surmonter cette limitation, vous pouvez utiliser XMLHttpRequest natif au lieu de la méthode AJAX de jQuery. Cette approche vous permet de définir explicitement le type de réponse sur 'blob' :

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    handler(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();

Alternativement, avec jQuery version 3, il devient possible de récupérer des images sous forme de blobs :

jQuery.ajax({
  url: 'https://images.unsplash.com/...',
  cache: false,
  xhr: function() {
    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() {}
});

En utilisant ceci approche, vous pouvez récupérer efficacement des images sous forme de blobs et ensuite effectuer des opérations telles que les télécharger sur un autre serveur dans une requête POST.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn