Necesito detectar de alguna manera que el usuario ha presionado el botón Atrás del navegador y volver a cargar la página con actualización (recargando el contenido y CSS) usando jquery.
¿Cómo detectar tal acción a través de jquery?
Porque en este momento algunos elementos no se recargan si uso el botón Atrás en un navegador. Pero si uso enlaces en el sitio web, todo se actualiza y se muestra correctamente.
¡IMPORTANTE!
Algunas personas probablemente han entendido mal lo que quiero. No quiero actualizar la página actual. Quiero actualizar la página que se carga después de presionar el botón Atrás. esto es lo que quiero decir de una manera más detallada:
Puede usar el evento pageshow para manejar la situación cuando el navegador navega a su página a través del recorrido del historial:
window.addEventListener( "pageshow", function ( event ) { var historyTraversal = event.persisted || ( typeof window.performance != "undefined" && window.performance.navigation.type === 2 ); if ( historyTraversal ) { // Handle page restore. window.location.reload(); } }); Tenga en cuenta que la memoria caché HTTP también puede estar involucrada. Debe configurar los encabezados HTTP adecuados relacionados con la caché en el servidor para almacenar en caché solo los recursos que deben almacenarse en caché. También puede hacer una recarga forzada para instruir al navegador para que ignore el caché HTTP: window.location.reload( true ) . Pero no creo que sea la mejor solución.
Para más información consulta:
Ha pasado un tiempo desde que se publicó esto, pero encontré una solución más elegante si no necesita admitir navegadores antiguos.
Puedes hacer una consulta con
performance.navigation.typeLa documentación, incluida la compatibilidad con el navegador, está aquí: https://developer.mozilla.org/en-US/docs/Web/API/Performance/navigation
Entonces, para ver si la página se cargó desde el historial usando atrás, puede hacer
if(performance.navigation.type == 2){ location.reload(true); } El 2 indica que se accedió a la página navegando en el historial. Otras posibilidades son-
0: se accedió a la página siguiendo un enlace, un marcador, el envío de un formulario o un script, o escribiendo la URL en la barra de direcciones.
1: Se accedió a la página haciendo clic en el botón Recargar o mediante el método Location.reload().
255: De cualquier otra manera
Estos se detallan aquí: https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNavigation
Nota Performance.navigation.type ahora está obsoleto en favor de PerformanceNavigationTiming.type que devuelve 'navegar' / 'recargar' / 'atrás_adelante' / 'prerender': https://developer.mozilla.org/en-US/docs/Web /API/PerformanceNavigationTiming/type
Dado que performance.navigation ahora está en desuso, puede probar esto:
var perfEntries = performance.getEntriesByType("navigation"); if (perfEntries[0].type === "back_forward") { location.reload(true); }