Я использовал create-реагировать-приложение для создания клиентского кода и создал экспресс-бэкэнд с парой маршрутов '/ api'. Мне пришлось добавить "proxy": "http://localhost:8080" (экспресс прослушивает порт 8080), чтобы реагировать на приложение. Чтобы проверить это, я вызвал fetch('/api/users') в приложении componentDidMount, которое обновляет состояние и состояние отображается в рендере.
Все работает нормально, и я решаю добавить <BrowserRouter>, и все, кажется, работает нормально, но затем я замечаю немного раздражающую проблему: если я перехожу на localhost:3000/api/users вручную, я получаю свой NotFoundPage (который, я думаю, ожидается, потому что маршрутизатор обрабатывает маршрутизацию, и он не знает для этой страницы), но затем, если я нажимаю кнопку назад в моем браузере, которая заставляет меня вернуться к localhost:3000, я получаю эту строку, которая на самом деле является моим index.html файлом, в месте, где результат от вызова API должен быть. По сути, fetch localhost:3000/api/users возвращает index.html, когда я вручную перехожу на localhost:3000/api/users и использую кнопку возврата браузера, чтобы вернуться к localhost:3000.
Если я не использую кнопку возврата браузера, а вместо этого вручную перехожу с localhost:3000/api/users на localhost:3000, все работает нормально. Если я иду по разным маршрутам, таким как localhost:3000/whatever, и использую кнопку «Назад», чтобы попасть на домашнюю страницу, все работает нормально Кажется, это единственная проблема при переходе от localhost:3000/api/users к localhost:3000 с помощью кнопки возврата.
Я тоже пытался использовать axios, но та же проблема.