Я надеюсь выяснить, почему не выполняется запрос API в приложении React, запущенном в Firefox.
Заголовки имеют следующий вид:
Accept */*
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Connection keep-alive
DNT 1
Host backend:8080
origin http://localhost:3000
Referer http://localhost:3000/
User-Agent Mozilla/5.0 ...
В Chrome непрозрачное сообщение сообщает о некоторой сетевой ошибке (ish):
request.js?176a:41 GET http://backend:8080/api/foobar/
net::ERR_NAME_NOT_RESOLVED
В Firefox естькажется, немного больше информации:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://backend:8080/api/foobar/. (Reason: CORS request did not succeed).
У меня есть среда, состоящая из двух соответствующих узлов, frontend
и backend
.frontend
работает на сервере, на котором размещены биты frontend
React.backend
- это приложение Flask, предоставляющее набор простых API-интерфейсов JSON.Цель frontend
- вызвать backend
через JSON API.
Конфигурация docker-compose
такова, что они работают в одной логической сети.Сначала я подозревал, что проблема была docker-compose
, и, возможно, произошел сбой DNS.Однако я смог исключить этот случай, вручную остановив узел frontend
и заново подключив тот же контейнер к сети, чтобы я мог запустить оболочку bash
и пропинговать хост backend
.Кроме того, я смог получить те же биты через curl
из backend
.Так что это исключает проблему с сетью Docker (я думаю).
Следующий логический преступник - это что-то, связанное с CORS.Запрос frontend
попадает в отдельный домен (например, backend
), поэтому это может объяснить поведение.
В соответствии с документами , перечисленными в консоли разработчика Firefox , заявлено, что произошла "фундаментальная ошибка сети".
Для правильной настройки я настроил Flask-CORS на backend
и проверил, что правильные заголовки передаются с сервера.Чтобы быть точным, Access-Control-Allow-Origin: *
.
Тем не менее, из журналов сервера backend
- все еще нет новых сетевых запросов.Я предположил, что, возможно, был OPTION
запрос на backend
в особом случае, описанном в Mozilla CORS Docs , и это не помогло.Тем не менее, это, по крайней мере, вызвало бы запись журнала в выводе консоли Flask, указывающую, что запрос OPTION
был выполнен.Чтобы потакать моей паранойе, я даже вспыхнул Wireshark.Похоже, что даже Firefox (и Chrome) не отправляет никаких соответствующих сетевых запросов!
Скорее всего, я слишком усложняю это, и это что-то до боли простое.Но хотелось бы некоторые указатели в правильном направлении.