history.replaceState не работает для Firefox v56 + - PullRequest
0 голосов
/ 02 мая 2018

В моем приложении Чтобы скрыть некоторую информацию в URL, я использую следующий код .

history.replaceState ({}, "", "bar.html");

Работает во всех браузерах , за исключением последней версии Firefox (v56 +)

В Firefox, если я нажимаю F5, он возвращается к предыдущему URL, который я уже заменил приведенным выше кодом.

Любая помощь будет высоко оценена.

1 Ответ

0 голосов
/ 30 апреля 2019

Существует открытый выпуск по Bugzilla.

Пример видео 1 и Пример видео 2 объясняют, как воспроизвести ошибку.

Условия:

  1. Только версия Mozilla Firefox 56+
  2. Одностраничное приложение
  3. Для маршрутизации используется history.replaceState, все параметры не равны нулю

Шаги:

  1. Войти и перенаправить на главную страницу базы URL
  2. Перейдите на любую вкладку приложения и замените параметры URL
  3. Нажмите F5, cmd + r или нажмите кнопку Refresh
  4. Ups! .. Снова откройте главную страницу с базой URL (но в других браузерах мы видим выбранную вкладку и правильный URL)

Такое же поведение наблюдается при удалении строк запроса из URL.

Это может быть вызвано следующим поведением (цитирую Вадим Гончаров )

Основная проблема заключается в том, что после использования history.replaceState и затем нажатия cmd+r/f5 мы увидим, что браузер отправляет замененный (правильный) url на сервер, но показывает неверный URL как в location.search, так и в строке браузера . И это поведение продолжается (если нажать «cmd + r / f5») до тех пор, пока мы не нажмем «enter» на панели URL браузера.

Первый Обходной путь отправлено с Феликс Ли

Прежде чем позвонить history.replaceState, сделайте location.hash = location.hash;

Установка hash на себя не имеет никакого эффекта, но устраняет ошибку .

Этот обходной путь не идеален, и mtomalley добавляет второй обходной путь

Браузер запрашивает URL-адрес, отличный от того, что показан в строке адреса ....

Кроме того, обходной путь не идеален, потому что если URL еще не имеет hash, location.hash = location.hash добавляет его, вызывает popstate, а добавляет запись истории .

Альтернативный обходной путь, который гораздо менее прост:

  1. Используйте любые доступные для вашей серверной технологии средства для выставления запроса URI на клиенте
  2. При загрузке страницы (перед любым кодом маршрутизации клиента), проверьте URI против window.location
  3. Если они разные, используйте replaceState, чтобы исправить это.

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

Третий обходной путь , предложенный Mathis Wiehl

window.addEventListener('unload', function(event) { location.replace(location) });

Таким образом, состояние местоположения js сбрасывается в местоположение FF в случае обновлений и закрытий вкладок (которые, кстати, имеют ту же проблему при открытии, например, с помощью + ⇧ + t).

Обходной путь от Mathis имеет следующую проблему (я цитирую jimmyhmiller )

Next.js попытался использовать обходной путь, о котором упоминал Матис, и это вызвало у них некоторые проблемы. Подробности здесь: https://github.com/zeit/next.js/pull/6896

Произошла новая ошибка с описанным выше обходным путем , объясненным в проблеме # 6882

при посадке на страницу, содержащую параметры запроса, браузер «блокируется» на этой странице и программно или вручную перемещается на другую страницу того же домена, перенаправляя обратно на оригинал. обратите внимание, что это не начнет происходить, пока в URL не будет включен параметр запроса, совершенно странно

Я также включил список других проблем, связанных с mozilla, с history.replaceState .

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

...