Проблема с проверкой изображения, существующего на удаленном сервере, в браузере Chrome с помощью XMLHttpRequest
Я использую этот метод JQuery на странице, чтобы проверить, существует ли изображение:
function imageExists(imageUrl) {
var http = new XMLHttpRequest();
http.open('HEAD', imageUrl, false);
http.send();
return http.status !== 404;
}
Если я загружаю страницу в браузере, она отлично работает, но если я перехожу на следующую страницу, а затем возвращаюсь на эту страницу, скрипт работает неправильно. В консоли браузера ошибка:
Access to XMLHttpRequest at 'https://server/image.jpg' from origin 'http://client' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Эта ошибка возникает только тогда, когда я возвращаюсь с другой страницы сайта на эту страницу в браузере Chrome. В браузерах Firefox и Edge нет ошибок
Спасибо!!!
Я знаю, что CORS включен на сервере с изображениями. Возможно, политика CORS настроена неправильно на удаленном сервере. Но почему он работает без ошибок при загрузке страницы?
Затем ответ должен отображать соответствующие заголовки в сетевой панели; Имеет ли это?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Эта проблема была устранена путем добавления заголовка запроса «Cache-Control» со значением «no-cache»:
function imageExists(imageUrl) {
var http = new XMLHttpRequest();
http.open('HEAD', imageUrl, false);
http.setRequestHeader('Cache-Control', 'no-cache');
http.send();
return http.status !== 404;
}
Эта ошибка должна быть в любом случае, CORS не зависит от того, перемещаетесь ли вы туда и обратно между своими собственными страницами, а исключительно от того, разрешает ли удаленный хост такой запрос или нет.