Я работаю над устаревшим одностраничным приложением, которое использует AJAX для загрузки различных внутренних представлений. После недавних обновлений браузера кнопка «Назад» в браузере перестала вести себя должным образом.
Текущая проблема:
Когда пользователь нажимает кнопку «Назад» в Firefox, все работает как задумано — приложение восстанавливает предыдущий вид в приложении, не покидая страницу.
В Chrome первый щелчок «Назад» правильно восстанавливает предыдущий вид в приложении, но второй щелчок «Назад» всегда запускает пользователь выходит из приложения и возвращается на экран входа в систему.
Я уже использую History.pushState и слушаю popstate, чтобы восстановить внутреннее содержимое и повторно загрузить состояния защиты, когда это необходимо.
Похоже, что Chrome не учитывает состояние защиты или просто проходит мимо него.
Я пробовал:
-Уникальные хеш-фрагменты для каждого состояния
-Замена базового состояния
-Повторная отправка охранные штаты в popstate
Похоже, что ничего из этого не имеет значения в Chrome.
function sendAction(action, content) {
// Capture current dynamic content
const section = document.querySelector('.content section.rows');
const html = section ? section.innerHTML : '';
// Push in-app navigation state
const newUrl = window.location.href.split('#')[0] + '#' + encodeURIComponent(content);
history.pushState({ html, content }, null, newUrl);
// (Ajax content loading happens here)
}
// Back button handling
window.addEventListener('popstate', function(event) {
const section = document.querySelector('.content section.rows');
if (event.state && event.state.html && section) {
// Restore previous HTML content
section.innerHTML = event.state.html;
event.preventDefault();
return;
}
// Prevent leaving the app
history.pushState({ guard: true }, null, window.location.href);
event.preventDefault();
});
// Initialize base history state
if (!history.state) {
const section = document.querySelector('.content section.rows');
history.replaceState(
{ initialized: true, html: section ? section.innerHTML : '' },
null,
window.location.href
);
}
Подробнее здесь: https://stackoverflow.com/questions/797 ... hrome-only