Historial de HTML5 que deshabilita el botón de reenvío

Question

Estoy escribiendo una aplicación de una sola página de JavaScript utilizando la API de historial de HTML5. La aplicación carga contenido a través de Ajax e internamente mantiene información de estado en la pantalla de primer plano usando una pila de pantallas.

Quiero habilitar la navegación con el botón Atrás, pero no quiero que el botón de reenvío esté habilitado.

Un par de trozos rápidos de información:

• El usuario sólo debe nunca ser capaz de volver atrás, no hacia adelante
• Al pulsar el botón atrás del navegador se cierra el usuario actual de pantalla de la página está encendido y vuelve a cargar la anterior uno
• El proyecto está dirigido a la última versión de Chrome solamente, por lo que las implementaciones de otros navegadores no son importantes
• Estoy usando JavaScript nativo y jQuery solamente, me gustaría hacer esto sin History.js

Cuando me carga una nueva pantalla funciono con la siguiente línea:

history.pushState(screenData, window.document.title, "#"); 

Ato al evento popstate a través de jQuery:

$(window).bind("popstate", function(event) { 
    if (event.originalEvent.state != null) { 
     // Logic that loads the previous screen using my screen stack 
    } 
}); 

gestión de la historia de mi aplicación está funcionando, sin embargo, cuando Vuelvo que el botón de adelanto está habilitado. Necesito averiguar cómo eliminar datos de history en el evento popstate.

¿Puedo hacer esto con replaceState? No estoy seguro de cómo ir haciendo esto ...

Answer 1

parte mala

Realmente para desactivar el botón de avance, que tendría que ser capaz de eliminar el historial del navegador, que no está permitido por todos implementaciones de JavaScript porque permitiría a los sitios eliminar todo el historial, lo que nunca sería del interés del usuario.

Buena parte

Esto es un poco complicado, pero creo que podría funcionar si usted quiere hacer historia personalizado. Simplemente puede usar pushState en el evento popstate para hacer que su página actual sea la entrada del historial superior. Supongo que por la forma en que manejas tu historial, tu ventana nunca se descargará. Esto le permite realizar un seguimiento de la historia de usuario a sí mismo:

var customHistory = []; 

empuje cada página que se carga con history.pushState(screenData, window.document.title, "#");, como lo hacía antes.Sólo que añadir el estado a su historial de costumbre, también:

history.pushState(screenData, window.document.title, "#"); 
customHistory.push({data: screenData, title: window.document.title, location: '#'}); 

ahora si tiene un evento popstate, sólo que el pop historia costumbre y lo empuja a la entrada superior:

window.onpopstate = function(e) { 
    var lastEntry = customHistory.pop(); 
    history.pushState(lastEntry.data, lastEntry.title, lastEntry.location); 
    // load the last entry 
} 

O en jQuery

$(window).on('popstate', function(e) { 
    var lastEntry = customHistory.pop(); 
    history.pushState(lastEntry.data, lastEntry.title, lastEntry.location); 
    // load the last entry 
}); 

Answer 2

El historial de reenvío se borra cada vez que el usuario navega. Para deshabilitar el historial de reenvíos, puede simular esa navegación cargando una url en un iframe oculto ("sobre: ​​en blanco", por ejemplo) cuando se carga la página.

var rurl = "about:blank?e=" + Math.random(); 
window.open(rurl, "clear_fw");//being "clear_fw" the name of the iframe 

Espero que ayude.

Editar: Esto agregará una entrada en history.back ... En mi caso, eso no fue un problema, pero tenlo en cuenta.