Извините за длинный пост, но это требует некоторого контекста. Степка - Laravel + Vanilla JS, и я использую EtherPad для редактирования документов. Он встроен на последнем этапе формы из двух частей. > Данные, приведенные в первой части формы, хранятся через Laravel < /li>
EtherPad готов показать пустую подушку во второй части формы и создает свои собственные вещи в своей собственной базе данных < /li>
Представлена вторая часть: EtherPad обновляет его материал, я заполняю таблицу отображения в своей базе данных, а затем я делаю другие вещи, имеющие отношение только к моему приложению. < /li>
< /ul>
Выпуск < /h2>
Первая часть формы представлена через Ajax по различным причинам использования; Таким образом, если пользователь находится на второй части и перезагружает страницу, он возвращается к первому шагу, и часть моей работы теряется - он создает несоответствия в моей базе данных и позволяет ненужным материалам, созданным в EtherPad. < /p>
нужен < /h2>
Поэтому мне нужно поймать любые и все способы перезагрузить страницу и показать пользовательский модал подтверждения. Это позволяет мне правильно очистить данные. R, ctrl+shift+r), разловые ссылки нажмите (например, ссылка Go Back), кнопки мыши с подхватом/переадресация, ... Я понял, что не могу поймать кнопку перезагрузки браузера, которая неудачна.
подход 2 < /h2>
Я переключился на подход, используя Performancenavigationtiming, с событием перед загрузкой: < /p>
window.addEventListener('beforeunload', (event) => {
if (performance.getEntries()[0].type == "reload") {
Shared.cancelForm(false);
window.addEventListener('unload', (event) => {
Shared.cancelForm(false);
});
}
});
< /code>
работает как очарование, но браузер продолжает показывать мне свое собственное подтверждение модала, которое я не могу настроить или удалить, насколько я знаю. Когда пользователь нажимает «Оставайся на странице», он показывает мой собственный модал CANCELFORM. Я добавил слушатель Unload, чтобы попытаться поймать тот факт, что пользователь может нажать «Оставить страницу» в модале браузера, но, похоже, не работает. < /P>
Далее возможный подход < /h2>
Мне было интересно, может ли PerformanceObserver помочь, но я не уверен, как правильно его использовать, и не будет ли он иметь какое -либо использование в моем случае. Насколько я понимаю, вполне ограничено. !!
Подробнее здесь: https://stackoverflow.com/questions/793 ... stom-modal
