ajax - how - restclient




Modifica l'URL della barra degli indirizzi nell'app AJAX in modo che corrisponda allo stato corrente (6)

È improbabile che lo scrittore voglia ricaricare o reindirizzare il suo visitatore quando utilizza Ajax. Ma perché non usare il pushState / replaceState di HTML5?

Sarai in grado di modificare la barra degli indirizzi quanto vuoi. Ottieni URL dall'aspetto naturale, con AJAX.

Dai un'occhiata al codice sul mio ultimo progetto: http://iesus.se/

Sto scrivendo un'app AJAX, ma mentre l'utente si sposta attraverso l'app, vorrei che l'URL nella barra degli indirizzi si aggiornasse nonostante la mancanza di ricariche di pagina. Fondamentalmente, vorrei che potessero aggiungere un segnalibro in qualsiasi momento e quindi tornare allo stato attuale.

In che modo le persone gestiscono il mantenimento della RESTfulness nelle app AJAX?


Controlla se l'utente è "nella" pagina, quando fai clic sulla barra dell'URL, JavaScript indica che sei fuori pagina. Se cambi la barra dell'URL e premi 'INVIO' con il simbolo '#' al suo interno, vai di nuovo nella pagina, senza fare clic sulla pagina manualmente con il cursore del mouse, quindi un comando di evento keyboad (document.onkeypress) da JavaScript essere in grado di verificare se è inserito e attivo il javascript per il reindirizzamento. Puoi verificare se l'utente è nella pagina con window.onfocus e verificare se è fuori con window.onblur.

Sì, è possibile.

;)


Il metodo window.location.hash è il modo preferito di fare le cose. Per una spiegazione su come farlo, ajaxpatterns.org/Unique_URLs .

YUI ha un'implementazione di questo modello come modulo, che include soluzioni specifiche di IE per far funzionare il pulsante Indietro e riscrivere l'indirizzo usando l'hash. YUI Browser History Manager .

Anche altri framework hanno implementazioni simili. Il punto importante è che se vuoi che la cronologia funzioni insieme alla riscrittura dell'indirizzo, i diversi browser hanno bisogno di modi diversi di gestirla. (Questo è dettagliato nel primo articolo di collegamento.)

IE ha bisogno di un hack basato su iframe, in cui Firefox produrrà una doppia cronologia usando lo stesso metodo.


Il modo per farlo è manipolare location.hash quando gli aggiornamenti AJAX comportano un cambio di stato che desideri avere un URL discreto. Ad esempio, se l'URL della tua pagina è:

http://example.com/

Se una funzione lato client ha eseguito questo codice:

// AJAX code to display the "foo" state goes here.

location.hash = 'foo';

Quindi, l'URL visualizzato nel browser verrebbe aggiornato in:

http://example.com/#foo

Ciò consente agli utenti di contrassegnare lo stato "pippo" della pagina e utilizzare la cronologia del browser per navigare tra gli stati.

Con questo meccanismo in atto, dovrai quindi analizzare la parte hash dell'URL sul lato client utilizzando JavaScript per creare e visualizzare lo stato iniziale appropriato, poiché gli identificatori di frammento (la parte dopo il #) non vengono inviati al server.

Il plugin hashchange di Ben Alman rende quest'ultimo un gioco da ragazzi se stai usando jQuery.


SWFAddress funziona nei progetti Flash e Javascript e ti consente di creare URL con segnalibri (usando il metodo hash sopra menzionato) oltre a offrirti il ​​supporto per il pulsante Indietro.

http://www.asual.com/swfaddress/


Se OP o altri stanno ancora cercando un modo per modificare la cronologia del browser per abilitare lo stato, usare pushState e replaceState, come suggerito da IESUS, è il modo "giusto" per farlo ora. Il vantaggio principale rispetto a location.hash sembra essere che crea URL reali, non solo hash. Se la cronologia del browser che utilizza gli hash viene salvata e quindi rivisitata con javascript disabilitato, l'app non funzionerà, poiché gli hash non vengono inviati al server. Tuttavia, se è stato utilizzato pushState, l'intero percorso verrà inviato al server, che sarà quindi possibile creare per rispondere in modo appropriato ai percorsi. Ho visto un esempio in cui sono stati utilizzati gli stessi modelli di baffi sia sul lato server che sul lato client. Se il client avesse javascript abilitato, otterrebbe risposte rapide evitando il roundtrip al server, ma l'app funzionerebbe perfettamente senza il javascript. Pertanto, l'app può degradarsi con grazia in assenza di JavaScript.

Inoltre, credo che ci sia qualche framework là fuori, con un nome come history.js. Per i browser che supportano HTML5, utilizza pushState, ma se il browser non lo supporta, ricorre automaticamente all'utilizzo degli hash.







address-bar