jQuery in modo succinto jQuery e Ajax

La funzione jQuery ajax () è l'astrazione di livello più basso

Il jQuery ajax () la funzione è il livello più basso di astrazione disponibile per XMLHttpRequests (aka AJAX). Tutte le altre funzioni jQuery AJAX, come caricare(), sfruttare il ajax () funzione. Usando il ajax () la funzione offre la massima funzionalità disponibile per XMLHttpRequests. jQuery fornisce anche altre astrazioni di livello superiore per fare tipi molto specifici di XMLHttpRequests. Queste funzioni sono essenzialmente scorciatoie per ajax () metodo.

Questi metodi di scelta rapida sono:

  • caricare()
  • ottenere()
  • getJSON ()
  • getScript ()
  • inviare()

Il punto da portare via è che mentre le scorciatoie sono belle a volte, tutte le usano ajax () dietro le quinte. E quando vuoi tutte le funzionalità e le personalizzazioni offerte da jQuery quando si tratta di AJAX, allora dovresti semplicemente usare ajax () metodo.

Gli appunti: Di default, il ajax () e caricare() Le funzioni AJAX usano entrambi OTTENERE Protocollo HTTP.


jQuery supporta JSONP tra domini

JSON with Padding (JSONP) è una tecnica che consente al mittente di una richiesta HTTP, in cui viene restituito JSON, di fornire un nome per una funzione invocata con l'oggetto JSON come parametro della funzione. Questa tecnica non usa XHR. Utilizza l'elemento script in modo che i dati possano essere inseriti in qualsiasi sito, da qualsiasi sito. Lo scopo è quello di eludere le limitazioni della stessa fonte di XMLHttpRequest.

Usando il getJSON () Funzione jQuery, è possibile caricare i dati JSON da un altro dominio quando una funzione di callback JSONP viene aggiunta all'URL. Ad esempio, ecco come apparirebbe una richiesta di URL usando l'API di Flickr.

http://api.flickr.com/services/feeds/photos_public.gne?tags=resig&tagmode=all&format=json&jsoncallback=?

Il ? value è usato come scorciatoia che dice a jQuery di chiamare la funzione che viene passata come parametro del getJSON () funzione. Potresti sostituire il ? con il nome di un'altra funzione se non si desidera utilizzare questa scorciatoia.

Di seguito, inserisco una pagina Web, utilizzando l'API JSONP di Flickr, le foto più recenti contrassegnate da "resig". Si noti che sto usando il ? scorciatoia in modo che jQuery richiamerà semplicemente la funzione di callback che ho fornito a getJSON () funzione. Il parametro passato alla funzione di callback è i dati JSON richiesti.

       

Gli appunti: Assicurati di controllare l'API del servizio che stai utilizzando per l'uso corretto del callback. Ad esempio, Flickr utilizza il nome jsoncallback =? mentre Yahoo! e Digg usa il nome callback =?.


Interrompere un browser dalle richieste XHR nella cache

Quando si esegue una richiesta XHR, Internet Explorer memorizzerà nella cache la risposta. Se la risposta contiene contenuto statico con una lunga durata, il caching potrebbe essere una buona cosa. Tuttavia, se il contenuto richiesto è dinamico e potrebbe cambiare in base al secondo, è necessario assicurarsi che la richiesta non venga memorizzata nella cache dal browser. Una possibile soluzione è aggiungere un valore di stringa di query univoco alla fine dell'URL. Ciò garantirà che per ogni richiesta il browser richieda un URL univoco.

 // Aggiungi una stringa di query univoca alla fine dell'URL dell'URL: 'some? Nocache =' + (newDate ()). GetTime ()

Un'altra soluzione, che è più di una soluzione globale, è quella di impostare tutte le richieste AJAX per impostazione predefinita per contenere la logica no-cache che abbiamo appena discusso. Per fare questo, utilizzare il ajaxSetup funzione per disattivare globalmente la memorizzazione nella cache.

 $ .ajaxSetup (cache: false // True per impostazione predefinita. False indica che il caching è disattivato.);

Ora, per sovrascrivere questa impostazione globale con le singole richieste XHR, è sufficiente modificare l'opzione cache quando si utilizza il ajax () funzione. Di seguito è riportato un esempio codificato di fare una richiesta XHR usando il ajax () funzione, che sovrascriverà l'impostazione globale e memorizzerà nella cache la richiesta.

 $ .ajaxSetup (cache: false // True per impostazione predefinita. False indica che il caching è disattivato.); jQuery.ajax (cache: true, url: 'some', type: 'POST');