Как перехватить 404 при скачивании файла?

Question

[castetus]

Всем привет!
Есть ссылка с атрибутом download.
Если файла нет на сервере - как можно перехватить 404 ошибку средствами JS, чтобы красиво ее обработать?

Comments

[chincharovpc]

МОжно при нажатии на ссылку вызвать функцию и получить файл с помощью fetch, далее превратить файл в blob и перейти на ссылку blob. В catch можно перехватить ошибки

const downloadBlobFile = (id, fileName) => {
  fetch(`${API_URL}/files/download/${id}`)
      .then(response => {
        return response.blob()
      })
      .then(blob => {
        const link = window.document.createElement("a");
        link.href = window.URL.createObjectURL(blob);
        link.download = fileName || 'file';
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      })
      .catch(() => {
        //Обработка ошибок
      });
}

[castetus]

pakhrudin, ну да, через blob получилось. Сделайте ответом, я отмечу решением. Спасибо.

Answer 1

[chincharovpc]

МОжно при нажатии на ссылку вызвать функцию и получить файл с помощью fetch, далее превратить файл в blob и перейти на ссылку blob. В catch можно перехватить ошибки

const downloadBlobFile = (id, fileName) => {
  fetch(`${API_URL}/files/download/${id}`)
      .then(response => {
        return response.blob()
      })
      .then(blob => {
        const link = window.document.createElement("a");
        link.href = window.URL.createObjectURL(blob);
        link.download = fileName || 'file';
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      })
      .catch(() => {
        //Обработка ошибок
      });
}