JavaScript를 사용하여 서버에 이미지가 존재하는지 어떻게 확인할 수 있습니까?

JavaScript를 사용하여 서버에서 이미지 가용성 감지

서버에서 이미지와 같은 리소스의 존재를 확인해야 하는 경우가 많습니다. 이 기사에서는 JavaScript를 사용하여 서버에 이미지가 있는지 확인하는 방법을 살펴보겠습니다.

해결책:

이미지가 서버에 있는지 확인하려면 JavaScript의 XMLHttpRequest를 활용할 수 있습니다. (XHR) 객체를 사용하여 HEAD 요청을 보냅니다. HEAD 요청은 실제 콘텐츠를 다운로드하지 않고 지정된 리소스에 대한 HTTP 헤더를 검색합니다. HTTP 상태 코드가 404(찾을 수 없음)가 아니면 이미지가 서버에 존재한다는 의미입니다.

이 솔루션을 구현하는 한 가지 방법은 다음과 같습니다.

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

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

  return http.status != 404;
}

jQuery를 사용하면 솔루션을 단순화할 수 있습니다:

$.get(image_url)
  .done(function() {
    // Do something now you know the image exists.
  })
  .fail(function() {
    // Image doesn't exist - do something else.
  })

예:

이 방법을 사용하려면 스크래치 코드를 다음으로 바꿀 수 있습니다.

if (imageExists("../imgs/6.jpg")) {
  var nImg = document.createElement("img6");
  nImg.src = "../imgs/6.jpg";
}

위 내용은 JavaScript를 사용하여 서버에 이미지가 존재하는지 어떻게 확인할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!