Comment vérifier si une image existe sur le serveur avec JavaScript ?

Détection de la disponibilité des images sur le serveur avec JavaScript

Question :

Comment déterminer par programme si une ressource d'image existe sur le serveur utilisant JavaScript ?

Réponse :

En utilisant JavaScript, vous pouvez vérifier la disponibilité des images en lançant une requête HTTP à l'aide de XMLHttpRequest ou en exploitant une bibliothèque comme jQuery.

Considérez la solution suivante en utilisant XMLHttpRequest :

function imageExists(image_url) {
  const http = new XMLHttpRequest();

  http.open('HEAD', image_url, false);
  http.send();

  return http.status != 404;
}

Cette fonction envoie un HTTP HEAD demande à l'URL de l'image spécifiée et vérifie si l'état de la réponse n'est pas 404 (introuvable). Si l'image existe, elle renvoie vrai ; sinon, il renvoie false.

Vous pouvez également utiliser jQuery pour une implémentation concise :

$.get(image_url)
  .done(function() { 
    // Image exists - take appropriate action.
  })
  .fail(function() { 
    // Image doesn't exist - handle accordingly.
  });

En utilisant ces techniques, vous pouvez vérifier dynamiquement la disponibilité des images et modifier votre code HTML en conséquence.

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!