• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

166
Views
Angular cómo rastrear/verificar el tiempo antes de recargar/actualizar el navegador

En mi aplicación web Angular, cuando un navegador se actualiza o recarga, el inicio de sesión del usuario se pierde y debe seguir los pasos de inicio de sesión nuevamente. Me gustaría permitir que el estado de inicio de sesión permanezca abierto para el usuario después de que se vuelva a cargar el navegador, pero solo dentro de un breve intervalo, quizás 10 segundos más o menos. Cuando la aplicación web se recarga, verifica si el regreso está dentro de este intervalo de 10 segundos. Para eso, necesito saber cuándo se actualizó/recargó o el último momento en que la aplicación estuvo activa.

¿Cómo determinamos el momento justo antes de que el navegador se vuelva a cargar (o se cierre) o el momento más cercano a eso?

almost 3 years ago · Juan Pablo Isaza
2 answers
Answer question

0

Puede capturar el evento de recarga y almacenar una marca de tiempo en el almacenamiento local, luego verifique y compare cada vez que se inicie su aplicación. Una función simple puede ser:

 window.onbeforeunload = ()=>{ localStorage.setItem('last_reload_time',(new Date()).getTime()); }

Luego, en su aplicación, verifique last_reload_time y compárelo con la marca de tiempo actual.

Otro evento DOM que puede ayudar es el cambio de visibilidad.

almost 3 years ago · Juan Pablo Isaza Report

0

En su forma JS simple, utilicé la respuesta de Metabolic como punto de partida. Sin embargo, la funcionalidad del evento: "onbeforeunload" es un poco complicada como se indica aquí: MDN , y algunos navegadores, por ejemplo, Chromeware, me dan la espalda al evento, no se disparan. Tenga en cuenta que, en la mayoría de los casos, el evento de recarga se activa, pero el depurador no lo detecta y si coloca puntos de interrupción (por ejemplo, en fn: onBeforeUnload() ), ¡no espere que detengan su código en el evento!

Usé este enfoque con rxjs para resolver - en Angular.

 import { fromEvent } from 'rxjs'; persistKey: string = 'TIME_BEFORE_UNLOAD'; //// eventually, instead of rxjs: fromEvent(...) //// you can use this: // @HostListener("window:beforeunload", ["$event"]) // unloadHandler(event: Event) { // this.onBeforeUnload(event); // } ngOnInit() { // use this to test and see; // the time stamps should change in console // after each reload click console.log('-- Stored time before unload: ', localStorage.getItem(this.persistKey)); this.subscribeToBrowserEvents(); } private subscribeToBrowserEvents() { fromEvent(window, 'beforeunload') .subscribe(event => this.onBeforeUnload(event)); } private onBeforeUnload(event) { const val: string = new Date().toISOString(); localStorage.setItem(this.persistKey, val); }
almost 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error