Как отправлять запросы API на сервер через JSON? Продолжайте получать ошибки CORS - PullRequest
0 голосов
/ 05 мая 2018

Я использую ReactJs и Axios для отправки запросов API на мой сервер, но постоянно получаю ту же ошибку:

Failed to load http://***: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 400.

Я пытаюсь выполнить запрос POST. Я также пытался загрузить Chrome Plugin, чтобы разрешить CORS. Он работал для запросов GET, но не работает для POST, похоже.

Если я пытаюсь сделать запрос на https://jsonplaceholder.typicode.com/users, он работает нормально. Так что я думаю, что-то не так с сервером.

Мой сервер использует Nginx и работает на ОС CentOS 7.

Q: Как можно включить CORS только для моей локальной разработки (localhost) или конкретных сайтов?

РЕДАКТИРОВАТЬ: Я уже пытался использовать эту конфигурацию на моем сервере Nginx - без везения: https://enable -cors.org / server_nginx.html

Ответы [ 3 ]

0 голосов
/ 05 мая 2018

Для разработки я использую расширение Firefox CORS Everywhere . Он изменяет весь веб-трафик, включая правильные заголовки CORS. (Это работает по крайней мере с несколько устаревшим Firefox в Opensuse 42.3.)

https://addons.mozilla.org/en-US/firefox/addon/cors-everywhere/

Обратите внимание, что это подрывает механизм безопасности браузера.

Для развертывания необходимо настроить сервер, чтобы отправлять правильные заголовки CORS. (Я никогда этого не делал, готовый сайт планируется работать на одном IP.)

0 голосов
/ 05 мая 2018

Если у вас есть доступ к серверу, и сервер использует Nodejs, это должно работать для вас:

CD в папку вашего сервера:

cd server-folder

Затем выполните эту команду для установки пакета 'cors':

npm install cors

Чтобы получить доступ к этому пакету, перейдите в файл вашего сервера в вашей IDE и в следующей доступной строке:

const cors = require('cors');

Затем добавьте эту строку, чтобы использовать промежуточное ПО (при условии, что вы используете Express):

app.use(cors());
0 голосов
/ 05 мая 2018

Хотя я не могу ответить вам каким-то конкретным кодом, вот что происходит (по крайней мере, то, что произошло в прошлый раз, когда я пробовал Angular и у меня были похожие проблемы):

Перед отправкой дальнейших запросов будет только заголовок OPTIONS HTTP-запрос, отправленный на URL-адрес сервера. При ответе на этот вызов сервер должен отправить поле заголовка Access-Control-Allow-Origin, содержащее белый список доменов, которым разрешено выполнять дальнейшие вызовы с использованием API. Чтобы внести в белый список все запросы в вашей среде разработки, достаточно задать Nginx, чтобы он отвечал с Access-Control-Allow-Origin: *.

...