Как обрабатывать событие выгрузки окна с обратной поддержкой браузера в angular?

#javascript #angular #window.onunload

Вопрос:

У меня есть веб-приложение, которое по умолчанию сохраняет данные пользователя на стороне сервера, если пользовательское соединение закрывается каким-либо способом, который не был инициирован пользователем (например, процесс браузера пользователя прерывается, система пользователя отключается или если интернет пользователя отключается на некоторое время). Но если пользователь сам закроет браузер или закроет вкладку браузера, то в этом случае сервер должен удалить данные пользователя на серверной части.

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

Для этого я использовал unload событие window и вызвал api для удаления данных.

   @HostListener('window:unload', ['$event'])
  unloadHandler($event: any) {
    this.sendApiToDeleteData();
  }

 

Но эта функция не вызывается при нажатии кнопки «Назад» из браузера. Поскольку возврат будет инициирован пользователем нажатием кнопки возврата браузера. Я хочу удалить пользовательские данные. Но похоже, что выгрузка не работает с кнопкой возврата.

Кроме того, из документации здесь. В нем говорится, что событие несовместимо с обратным / прямым кэшем, и поскольку документ также предложил не использовать unload событие. Есть ли какой-либо другой способ обработки выгрузки страницы или какой-либо лучший способ обработки моего варианта использования?

Ответ №1:

Привет, вы можете использовать это вместе со своим кодом для обнаружения обратного нажатия:

   @HostListener('window:popstate', ['$event'])
  onPopState(event) {
    console.log('Back button clicked');
  }