Il pulsante Indietro del browser cambia l'url dinamico Parametri

Question

Sto lavorando a un sito Web, in cui il parametro url viene aggiornato in base all'azione dell'utente, in base al quale aggiorno la pagina Web senza eseguire l'aggiornamento. Considera lo scenario dell'e-commerce in cui l'URL cambia quando l'utente fa clic sui filtri e quindi i prodotti aggiornati vengono visualizzati.

Ora il problema è che quando l'utente fa clic sul pulsante Indietro del browser, il browser torna al precedente parametro-url, ma la pagina non è stata modificata. Voglio cambiare la pagina anche in base al parametro url che viene modificato dopo aver fatto clic sul pulsante Indietro.

ho provato questa soluzione:

$($window).on('popstate', function (e) { 
    // Update the page also 
}); 

Il problema con questo codice è, questo viene licenziato come URL cambia, significa che non si preoccupa se il browser di nuovo pulsante viene premuto, o url sta cambiando con il jQuery. Quindi, se sto modificando l'url in base all'interazione dell'utente, verrà richiamato anche il callback popstate e anche la mia funzione personalizzata. Per aggiornare la pagina sto usando le richieste https, quindi http api viene chiamato due volte.

C'è un modo per controllare se si fa clic solo "Pulsante Indietro"?

Answer 1

Ti consiglio di cambiare il tuo disegno un po 'e di attivare tutti gli aggiornamenti del contenuto (l'elenco dei prodotti nel tuo caso) ascoltando le modifiche dell'URL, non solo le modifiche dell'URL causate dal pulsante Indietro. Quindi, invece di attivare qualsiasi re-rendering sugli eventi click, lascia che questi pulsanti siano link regolari all'url che rappresenta il tuo contenuto e attiva la funzionalità dall'evento popstate.

Ecco come tutti i framework MVVM come Angular.js, Backbone ecc sono progettati e pensati per essere utilizzati.

In questo modo sarà anche molto più semplice mantenere l'applicazione a lungo termine.

Buona fortuna!