history.pushstate e HTTP POST repost modulo

Question

Attualmente sto affrontando un piccolo problema con i moduli di posta HTTP e la cronologia pushstate.

Quando il mio utente invia un modulo POST in example.com/page-1 e poi fa clic su un collegamento all'interno di questa pagina, vengono reindirizzati a example.com/page-2 con un record.pushstate. Lo script JS cambia solo l'url corrente, spinge il vecchio nella cronologia e quindi visualizza il nuovo contenuto. Questo funziona perfettamente bene per me.

Il problema: una volta che l'utente è in example.com/page-2 e aggiorna manualmente la pagina (Ctrl + R o aggiornare il pulsante), Chromes richiede all'utente di inviare nuovamente il form; ma il modulo era in realtà in example.com/page-1 e non c'è motivo di richiederlo in questa "nuova" pagina.

C'è un modo per cancellare tutti i dati precedentemente inviati in javascript sulla modifica del popstate per impedire il prompt di repost dal browser? O mi sto perdendo qualcosa con i miei stati storici? O è qualcosa che al momento non è ancora implementato dal browser?

L'ho provato solo con il chrome poiché non implementavo lo pushstate con altri browser.

Answer 1

Forse provare sostituireState invece? Vedi this.

Il replaceState() metodo

history.replaceState() funziona esattamente come history.pushState(), tranne che replaceState() modifica la voce storia attuale invece di crearne uno nuovo.

replaceState() è particolarmente utile quando si desidera aggiornare l'oggetto di stato o l'URL della voce della cronologia corrente in risposta a un'azione dell'utente.

Answer 2

Ho un problema identico - sto usando l'API di cronologia con BackboneJS.

La soluzione che ho pensato è di avere una pagina intermedia a cui il modulo reindirizza dopo aver effettuato l'accesso. Lo scopo di questa pagina intermedia è di aggiungere una pagina non POST prima della pagina di destinazione in modo che il browser non richiedere di inviare nuovamente il modulo (e per Chrome NON aggiungere una voce ridondante).

Per esempio, dopo l'invio del modulo POST nel example.com/page-1 il server dovrebbe reindirizzare l'utente a example.com/page-1a

example.com/page-1a possibile verificare che le credenziali dell'utente sono presenti, e quindi reindirizzare a example.com/page-2. Questo risolverà il tuo problema, credo.

Per il meccanismo di reindirizzamento, ci sono 3 opzioni che mi viene in mente:

1. server-side redirect
2. JavaScript (location.href="page-2")
3. intestazione HTML (<meta http-equiv="refresh" content="0; URL='http://example.com/page-2'" />)

Personalmente ho provato le opzioni 1 e 2: funzionano bene per me. Spero che questo ti aiuti!