Почему браузер не может получить данные через fetch?

Question

[Berry90]

При получении данных через fetch локально с браузера выдает ошибку blocked by CORS policy, сам запрос такой

fetch('апи', {
        headers: {
            'X-AUTH-TOKEN': 'ключ',
            'Content-Type': 'application/json',
            'Authorization': 'application/json'
        }
    }).then(response => console.log(response))

при запросе через postman все работает, при запросе через retrofit в приложении на андроид тоже все работает, почему браузер ругается на cors?

Answer 1

[Надим]

Загуглите про CORS. Если коротко, то сайт с которого вы запрашивайте данные должен явным образом дать разрешение на чтение ответа, иначе будет ошибка CORS. Разрешение дается посредством добавления заголовка Access-Control-Allow-Origin к ответу, вы должны модифицировать код на стороне своего сайта таким образом, чтобы он добавлял к своему ответу этот заголовок.

https://yandex.ru/search/?text=Access-Control-Allo...

Comments

[Berry90]

когда делаю запрос через postman(прога для проверки рест апи) все работает, также все работает через андроид приложение (retrofit)

[Rsa97]

Berry90, CORS - это функция браузера и используется только на обычных страницах, когда со страницы одного сайта делается AJAX-запрос к другому сайту. Другие приложения или расширения браузеров не используют политику CORS.

[Berry90]

Rsa97, получается это можно исправить только изменив настройки сервера?

[Rsa97]

Berry90, Да. Сервер должен отвечать с правильными CORS-заголовками, в том числе и на запрос OPTIONS.
Посмотрите, на схемы двух типов запросов: https://developer.mozilla.org/ru/docs/Web/HTTP/CORS

[Надим]

Berry90, варианта у вас два:
1. Сделать так, чтобы сервер отдавал корректный заголовок
2. Использовать дополнительный сервер, который будет пропускать запрос через себя по пути добавляя нужный заголовок

[Berry90]

Rsa97, доступа к серверу нет

[Berry90]

Надим Закиров, если файлы будут на одном сервере то проблемы с cors не будет?

[Надим]

Berry90, не будет, когда вы что-то грузите со своего домена, ограничений нет.

[Rsa97]

Berry90, Значит вам нужен свой сервер, проксирующий запросы. Фронт шлёт запрос с вашему серверу, ваш сервер запрашивает данные с сервиса и возвращает фронту.
Если всё будет на одном сервере (с точным совпадением доменного имени и порта), то браузер не будет использовать CORS.

[Berry90]

Надим Закиров, благодарю

[Berry90]

Rsa97, благодарю, напиши как ответ тоже отмечу как решение