Come funziona AJAX?

Qual è l’essenza di AJAX? Ad esempio, desidero avere un link sulla mia pagina in modo che quando un utente fa clic su questo link, alcune informazioni vengano inviate al mio server senza il ricaricamento della pagina corrente. È AJAX?

Sono stato in grado di ottenere questo comportamento utilizzando isoframes. Più in dettaglio metto un link (diciamo una piccola immagine) in un piccolo isoframe. Quando l’utente fa clic su questo collegamento, il browser ricarica solo la pagina in isoframe.

Tuttavia, penso che non sia un modo elegante per raggiungere l’objective. Penso di dover usare AJAX. Come funziona? Un utilizzo dell’XHTML può risolvere il problema considerato in modo elegante? O devo usare JavaScripts?

Non ho bisogno di molto. Voglio solo avere un piccolo link che (dopo aver cliccato) ha inviato alcune informazioni al server. Diciamo che ho una “stella-immagine” vicino a un messaggio. Se un utente fa clic sulla stella (gli piace il messaggio), la stella cambia il colore e il mio database di aggiornamento del server (per ricordare che l’utente ha apprezzato il messaggio).

Se sei totalmente nuovo ad AJAX (che sta per Asynchronous Javascript And XML), la voce AJAX su wikipedia è un buon punto di partenza:

Come DHTML e LAMP, AJAX non è una tecnologia in sé, ma un gruppo di tecnologie. AJAX utilizza una combinazione di:

  • HTML e CSS per la marcatura e lo styling delle informazioni.
  • Il DOM accede con JavaScript per visualizzare e interagire dynamicmente con le informazioni presentate.
  • Un metodo per lo scambio di dati in modo asincrono tra browser e server, evitando così il caricamento della pagina. L’object XMLHttpRequest (XHR) viene in genere utilizzato, ma a volte viene utilizzato un object IFrame o un tag aggiunto dynamicmente.
  • Un formato per i dati inviati al browser. I formati comuni includono XML, HTML preformattato, testo normale e JavaScript Object Notation (JSON). Questi dati potrebbero essere creati dynamicmente da una qualche forma di scripting lato server.

Come puoi vedere, da un punto di vista puramente tecnologico, qui non c’è nulla di veramente nuovo. La maggior parte delle parti AJAX erano già presenti nel 1994 (1999 per l’object XMLHttpRequest ). La vera novità era usare queste parti insieme come Google ha fatto con GMail (2004) e Google Maps (2005). In realtà, entrambi i siti hanno contribuito in modo significativo alla promozione di AJAX.

Un’immagine che vale più di mille parole, sotto un diagramma che illustra la comunicazione tra il client e il server remoto, nonché le differenze tra le applicazioni classiche e quelle basate su AJAX:

alt text

Per la parte arancione, puoi fare tutto a mano (con l’object XMLHttpRequest ) oppure puoi usare le famose librerie JavaScript come jQuery , Prototype , YUI , ecc. Per “AJAXify” sul lato client della tua applicazione. Tali librerie mirano a hide la complessità dello sviluppo di JavaScript (ad esempio la compatibilità cross-browser), ma potrebbe essere eccessivo per una semplice funzionalità.

Sul lato server, possono essere d’aiuto anche alcuni framework (ad esempio DWR o RAJAX se si utilizza Java), ma tutto ciò che è necessario fare è fondamentalmente esporre un servizio che restituisce solo le informazioni richieste per aggiornare parzialmente la pagina (inizialmente come XML / XHTML – la X in AJAX – ma JSON è spesso preferito al giorno d’oggi).

AJAX in genere comporta l’invio di richieste HTTP dal client al server e l’elaborazione della risposta del server, senza ricaricare l’intera pagina. (In modo asincrono).

Javascript in genere esegue l’invio e riceve la risposta dei dati dal server (tradizionalmente XML, spesso altri formati meno dettagliati come JSON)

Il Javascript quindi può aggiornare la pagina DOM in modo dinamico per aggiornare la vista dell’utente.

Quindi “Javascript ascanico e XML”.

Ci sono altre opzioni per aggiornare la vista dell’utente senza ricaricare la pagina, cose come Flash e Applet, ma queste non sembrano buone soluzioni per il tuo caso. Sembra che Javascript sia la strada da percorrere. C’è un sacco di buoni supporti per le librerie in giro, come jQuery come viene usato su questo sito, quindi non è necessario scrivere molto Javascript da solo.

L’essenza di AJAX è questa:

Le tue pagine possono navigare sul Web e aggiornare i propri contenuti mentre l’utente sta facendo altre cose .

Cioè, il tuo javascript può inviare richieste GET e POST asincrone (di solito tramite un object XMLHttpRequest ) quindi utilizzare i risultati di tali richieste per modificare la sua pagina (tramite manipolazione del modello object Document ).

Ajax è più che ricaricare solo una parte della pagina. Ajax sta per Asynchronous Javascript e Xml.

L’unica parte di Ajax di cui hai bisogno è l’object XMLHttpRequest di javascript. Devi usarlo per caricare e ricaricare una piccola parte del tuo html come div o altri tag.

Leggi questo esempio e sarai pro prima come credi!

    
Name: Time:

AJAX sta per Asynchronous Javascript e XML. AJAX supporta aggiornamenti parziali alle pagine senza dover reinserire l’intera pagina sul server.

Ci sono molte opzioni per AJAX. I due più importanti (discutibilmente) sono ASP.NET AJAX di Microsoft (precedentemente Atlas) e jQuery.

ASP.NET AJAX è relativamente facile da configurare se hai già familiarità con ASP.NET. jQuery è buono se conosci già javascript e consente un controllo molto granulare sull’interrogazione e l’aggiornamento della tua pagina.

HTH

Se sei interessato, IBM ha una serie di 10 (possibilmente più) parti su Ajax: Mastering Ajax parte 1

Sebbene abbia qualche anno ora è una buona introduzione (anche se leggi solo la prima parte!)

Penso che l’intera serie dovrebbe essere elencata qui , anche se il sito è un po ‘lento per me al momento …

Sommario:

Ajax, che consiste di HTML, tecnologia JavaScript ™, DHTML e DOM, è un approccio eccezionale che consente di trasformare interfacce Web grezze in applicazioni Ajax interattive. L’autore, un esperto Ajax, dimostra come queste tecnologie lavorino insieme – da una visione d’insieme ad un aspetto dettagliato – per rendere lo sviluppo Web estremamente efficiente una realtà facile. Svela anche i concetti centrali di Ajax, incluso l’object XMLHttpRequest.

quello è ajax. non puoi usare ajax senza javascript. dovresti guardare esempi di jquery e prototipi per avere un’idea dell’uso.

Quello che stai cercando di fare è tecnicamente ajax. Ajax crea transazioni di frammenti xhtml per aggiornare sezioni di una pagina. Javascript rende queste richieste belle e ordinate.