HTML5 Storia API: Aggiorna e ARRETRATI

Question

sto scrivendo codice per creare un UX simile a come le foto vengono visualizzate su Facebook dalla timeline ...

1. Visualizzazione timeline, si fa clic sulla foto si apre in una modale
2. si aggiorna e va ad una pagina dedicata per l'immagine
3. ti ha colpito di nuovo e si ritorna alla timeline

ho la maggior parte di questo lavoro attraverso il HTML5 Hist API API. Ecco quello che sto facendo quando si clicca un'immagine ...

1. Io uso preventDefault() evitare di seguire il link (alla pagina di immagine) e invece AJAX caricare un modale con l'immagine
2. ho pushState l'URI della pagina dell'immagine in modo che appaia nella barra degli indirizzi
3. Ora aggiorno e vengo indirizzato alla pagina di immagine dedicata (l'URI dal passaggio 2)
4. Quindi premo il pulsante "Indietro" e mostra l'URI della pagina precedente (ovvero la timeline) nella barra degli indirizzi ma sono ancora nella pagina dell'immagine.

Domanda: Al passo # 4, c'è un modo per bypassare l'API storia e solo il browser di eseguire un'azione standard "Indietro" in modo da poter tornare alla pagina precedente (vale a dire la linea temporale)?

Answer 1

Hai provato un buon vecchio stile history.go(-1);?

Answer 2

lo faccio come questo:

step 1 - salva l'URL della pagina iniziale (che è ancora invariata)

var savedPageStateURL = window.location.pathname; 

fase 2 - sostituire stato della storia attuale (non spingendo, solo sostituendo)

window.history.replaceState({}, null , url); 

fase 3 - annullare le modifiche di storia e tornare allo stato del primo passo

if('pushState' in window.history && window.history.state) 
    window.history.replaceState({}, null , savedPageStateURL);