Приложение React не может связаться с бэкенд-приложением python на localhost на том же сервере
У меня есть публичная облачная виртуальная машина, которая имеет публичный IP, скажем 160.159.158.157
(на ней зарегистрирован домен).
У меня есть приложение Django (бэкенд), которое поддерживает CORS и обслуживает данные через порт 8080.
У меня есть приложение React, запущенное на той же VIM на другом порту (3000), которое обращается к приложению Django и должно создавать отчет.
Проблема в том, что когда я использую http://<domain-name>:8080/api/
или http://<public-ip>:8080/api/
, мое приложение работает нормально,
но когда я пытаюсь получить данные с localhost, например, http://localhost:8080/api/
или http://127.0.0.1:8080/api/
, приложение React не может получить данные со следующей ошибкой:
Cross-Origin Request Blocked: Политика одинакового происхождения запрещает чтение удаленного ресурса по адресу http://127.0.0.1:8080/api/. (Причина: CORS-запрос не удался). Код состояния: (null).
.
Вот что я пробовал:
axios.get(baseURL, { headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods':'GET,PUT,POST,DELETE,PATCH,OPTIONS',
}
но это не сработало. Что мне делать?
Похоже, что вы перепутали, где должны быть эти заголовки. Вы устанавливаете их на запросе к бэкенду, но они должны быть установлены на ответе от бэкенда. В конце концов, было бы не очень хорошо с точки зрения безопасности, если бы кто-то, делающий запрос, мог просто сказать: "Да, я в порядке, вы должны мне доверять".
Проблема может быть где-то в вашем бэкенд-приложении Django, поэтому дважды проверьте конфигурацию CORS там.
я так много пытался переварить это, но почему-то это выглядит сложным для меня, но после долгих исследований я пришел к этой ссылке, проверьте, может ли она иметь отношение к вопросу введите описание ссылки здесь