javascript - volver - pushstate w3schools

el botón de retroceso en el navegador no funciona correctamente después de usar pushState(en Chrome)

Question

Estoy usando este tipo de línea en una respuesta JS

if (history && history.pushState){
     history.pushState(null, null, ''<%=j home_path %>'');
}

pero cuando vuelvo a hacer clic en el navegador, veo el código JS de la respuesta en lugar de la página anterior.

¿Hay alguna manera de hacer que el botón de retroceso funcione para que vuelva a solicitar la página del último url (antes de home_path como pushStated)?

Actualización :

He encontrado this ... parece que otros tienen el mismo problema con ... History.js tampoco lo soluciona

Así que para confirmar algunos de los comentarios allí .. Esto sucede sólo en cromo

Lo que pienso

Creo que la raíz de todo esto es que el estado pop solicita el mismo tipo de documento pushstate (respuesta js). Lo que hay que hacer es en popstate solicitar la respuesta html ... Simplemente no sé cómo

Más actualizaciones:

viendo http://railscasts.com/episodes/246-ajax-history-state que menciona usar

 $(window).bind("popstate", function() {
      $.getScript(location.href);
    });

esto resuelve el problema, pero de acuerdo con la comprensión de jQuery $ .getScript () sin el almacenamiento en caché ajax, agregará marcas de tiempo ... lo que contamina la url ... apagarlo hace que no vuelva a funcionar con el mismo efecto ...

¿Alguien sabe como resolver esto?

Aún más actualizaciones

Seguí los rastros del problema en todo el interweb y terminé con un problema en chrome que apunta a un problema de rieles (sin embargo , Firefox funciona bien) y un problema en rieles-ujs sobre no incluir Vary Header en las respuestas

El ejemplo se puede encontrar here

Answer 1

Actualmente estoy jugando haciendo

 response.headers[''Vary''] = ''Accept''

Lo que parece solucionar el problema, a primera vista.

Si alguien tiene el mismo problema, verifíquelo y hágamelo saber.

Answer 2

He probado este código en mi navegador usando un archivo HTML local y recibí un error de seguridad de la consola:

SecurityError: The operation is insecure.
  history.pushState(null, null, ''<%=j home_path %>'');

Puedo ver cómo manipular el historial del navegador puede considerarse un comportamiento potencialmente peligroso, por lo que supongo que debería comprobar que esto no le esté sucediendo a usted también. Trate de usar la consola de Javascript Firebug. También es posible que haya diferencias de comportamiento entre los archivos locales y http: // HTML.

Dicho esto, por lo que he visto que el último elemento de la matriz del history es básicamente la página actual, por lo que si desea cambiar el anterior, puede hacerlo usando dos comandos pushState (), primero presione el elemento anterior que desees, luego empujas nuevamente el camino actual. Si entendí tu problema correctamente.

Answer 3

Me pasó con sinatra y cromo.

Resuelto con:

$.ajaxSetup({ cache: false });

Answer 4

Necesitas agregar un oyente al evento popstate

window.onpopstate = function(event) {
    //load the page
};

Cuando se presiona el botón Atrás, se cambia la url y luego se activa el evento popstate. Es su responsabilidad cargar los detalles en su oyente de estado pop que coincidan con la URL cambiada.

Un buen ejemplo de popstate

Algunos navegadores activan un evento popstate cuando la página se carga por primera vez, lo que provoca un bucle infinito de carga de páginas. Esto se puede evitar agregando el siguiente cheque

var loadPage = window.history.state;
window.onpopstate = function(event) {
    if (loadPage) 
        //load the page
};

A continuación, establezca loadPage en true cuando se llame pushState

history.pushState(null, null, ''<%=j home_path %>'');
loadPage = true;

Esta técnica funciona en todos los navegadores que admiten la API de historial html5.