Как проверить GET запрос?

Question

[VegasChickiChicki]

Есть обращение к серверу через цикл и вот такое вот создание фото :

let image = new Image;

image.src = "../img/designers/" + index + '.' + id + ".jpg";

Цикл в цикле ,по этому 2 переменные index и id.
Но некоторых фото не существует и в консоль выводится сообщение с ошибкой:
0.0.jpg:1 GET localhost:3000/img/designers/0.0.jpg 404 (Not Found)
Можно ли как то проверить условием ,если фото есть или нет?

Comments

[Сергей Соколов]

фото грузятся с вашего домена или чужого?

[VegasChickiChicki]

Сергей Соколов, C локальных файлов сервера. Просто есть строки и столбцы и в некоторых местах должны быть изображения ,а в некоторых нет ,а циклы идут по всем строкам и столбцам.

Answer 1

[UndineS]

в цикле можно использовать команду continue для перехода к следующей итерации (не выполняем далее действия с текущими значениями счетчиков, а переходим к следующим значениям)
Например:

var index = 0, 
    id = 0;

while (i < 4) {
   i += 1;
   while (j > 4) {
      j +=1;
      if (i == 0 && j==0) {
         continue;
      } else {
         let image = new Image;
         image.src = "../img/designers/" + index + '.' + id + ".jpg";
      }
   }
}

Можно использовать как в while, так и в for:
https://learn.javascript.ru/while-for

Если закономерность отсутствующих фото выявить нельзя, то можно получить ответ сервера таким образом:

var xhr = new XMLHttpRequest();

xhr.open('GET', '/ajax-xmlhttprequest', true);

xhr.send();

xhr.onreadystatechange = function() {
  if (this.readyState != 4) return;

  // по окончании запроса доступны:
  // status, statusText
  // responseText, responseXML (при content-type: text/xml)

  if (this.status != 200) {
    // обработать ошибку
    alert( 'ошибка: ' + (this.status ? this.statusText : 'запрос не удался') );
    return;
  } else {
  alert('ответ 200! ссылка рабочая');
}

  // получить результат из this.responseText или this.responseXML
}

Подробнее тут: https://learn.javascript.ru/ajax-xmlhttprequest

Comments

[VegasChickiChicki]

Немного не то ,я для примера показал что фото 0.0 нет ,отсутствовать может и 5.1 и любое другое ,не известно фото с каким индексом нет.

[UndineS]

VegasChickiChicki, дополнен ответ

Answer 2

[Сергей Соколов]

Можно проверять свойства элемента complete и после него naturalWidth (или naturalHeight) через какое-то время после назначения src – достаточное для загрузки картинки. Проверка того, есть ли картинка, в любом случае немгновенна, асихнонна.

const srcs = [
    'https://sun6-5.userapi.com/c850632/v850632804/12d149/KnY01pJH16w.jpg'
    ,'https://sun6-6.userapi.com/c855020/v855020551/59a81/phM3k4nXcrg.jpg'
  ];
  
  function makeCheck(image) {
    return function() {
      if (image.complete  &&  image.naturalWidth) {
        console.log("картинка загрузилась ОК!");
      } else {
        console.error("Нет такой картинки: " + image.src);
      }
    }
  }
  
  for(let i = 0;i < srcs.length; i++) {
    const src = srcs[i];
    const image = new Image();
    window.setTimeout( makeCheck(image), 300);

//image.src = "../img/designers/" + index + '.' + id + ".jpg";
    image.src = src;
  }

Answer 3

[DanKud]

try {
    /* ваш код */
} catch (err) {
    /* код в случае ошибки */
   continue; /* для перехода на следующую итерацию цикла например */
}

https://learn.javascript.ru/exception