Реагировать - Страница не отображается при использовании кнопки назад браузера - PullRequest
Новая
       21

Реагировать - Страница не отображается при использовании кнопки назад браузера

1 голос
/ 06 мая 2019

Я просмотрел много связанных тем и до сих пор не смог решить мою проблему с моим приложением MERN.

Когда я пытаюсь перейти на другой сайт и использовать кнопку возврата браузеранекоторые страницы не отображаются.

Вместо этого я вижу только мой файл json / ответ API ... Мне нужно обновить страницу, чтобыбудет отображаться правильно.

Чтобы узнать, что происходит, перейдите на текущую версию веб-сайта здесь: https://www.joystock.org

Если, например, вы собираетесь:https://www.joystock.org/royalty-free-music/cinematic/page-1, попробуйте перейти на другой веб-сайт и нажмите кнопку возврата назад в браузере, страница не отображается ...

Это происходит только при выходе из веб-сайта,перейдите к другому и вернитесь с кнопкой возврата ... это не происходит, когда вы остаетесь на сайте.

Нет проблем со страницами:

https://www.joystock.org/how-to-use-our-music или https://www.joystock.org/license-agreement ...

Это происходит только для страниц, подобных этой:

https://joystock.com/royalty-free-music/:category/page-:page

Например:

https://www.joystock.org/royalty-free-music/all/page-1 или https://www.joystock.org/royalty-free-music/corporate/page-2

Это мои текущие репозитории git: https://github.com/Karaza/joystock

Iдумаю, что это может быть связано с состоянием в client/src/components/tracks/Tracks.js, но я не знаю, что исправить ....

Заранее благодарю за помощь (:

1 Ответ

1 голос
/ 07 мая 2019

Вероятно, это связано с проблемой кэша браузера. Это одностраничное приложение, использующее React, поэтому вам всегда нужно просматривать приложение index.html. Для этого вы правильно подаете index.html по подстановочному маршруту /*, объявленному после других ваших маршрутов, а также используете некоторое промежуточное программное обеспечение (резервирование истории). Но так как вы объявили один и тот же маршрут на клиенте и на сервере: /royalty-free-music/all/page-1 браузер может искать в кэше ответ и использовать тот, который предоставлен сервером (данные JSON), вместо того, который соответствует на переднее применение.

Вы можете решить эту проблему двумя способами:

  • очевидно, измените URL сервера или, возможно, добавьте к нему префикс api. Это было бы семантически более правильным (IMO), поскольку серверные и интерфейсные маршруты не служат одной и той же цели (здесь вы не имеете дело с рендерингом на стороне сервера)
  • отключить кеш на маршруте сервера, используя res.set('Cache-Control', 'no-store, no-cache, must-revalidate, private') в вашем маршруте.
...