Die jQuery Ajax ()
Funktion ist die unterste Abstraktionsebene, die für XMLHttpRequests (auch als AJAX bekannt) verfügbar ist. Alle anderen jQuery-AJAX-Funktionen, z Belastung()
, nutzen Sie die Ajax ()
Funktion. Verwendung der Ajax ()
Funktion bietet die größte verfügbare Funktionalität für XMLHttpRequests
. jQuery bietet auch andere Abstraktionen auf höherer Ebene für sehr spezifische Arten von XMLHttpRequests
. Diese Funktionen sind im Wesentlichen Verknüpfungen für die Ajax ()
Methode.
Diese Shortcut-Methoden sind:
Belastung()
erhalten()
getJSON ()
getScript ()
Post()
Der Punkt zum Mitnehmen ist, dass, obwohl die Verknüpfungen manchmal schön sind, sie alle verwenden Ajax ()
hinter den Kulissen. Wenn Sie alle Funktionen und Anpassungen wünschen, die jQuery für AJAX bietet, sollten Sie einfach die Ajax ()
Methode.
Anmerkungen: Standardmäßig ist die Ajax ()
und Belastung()
AJAX-Funktionen verwenden beide ERHALTEN
HTTP-Protokoll.
JSON with Padding (JSONP) ist eine Technik, mit der der Absender einer HTTP-Anforderung, in der JSON zurückgegeben wird, einen Namen für eine Funktion angeben kann, die mit dem JSON-Objekt als Parameter der Funktion aufgerufen wird. Diese Technik verwendet kein XHR. Es verwendet das Skriptelement, damit Daten von jedem Standort aus in jeden Standort gezogen werden können. Der Zweck besteht darin, die Richtlinieneinschränkungen von XMLHttpRequest aus derselben Quelle zu umgehen.
Verwendung der getJSON ()
Mit der jQuery-Funktion können Sie JSON-Daten aus einer anderen Domäne laden, wenn der URL eine JSONP-Callback-Funktion hinzugefügt wird. Als Beispiel würde eine URL-Anfrage mit der Flickr-API aussehen.
http://api.flickr.com/services/feeds/photos_public.gne?tags=resig&tagmode=all&format=json&jsoncallback
=?
Das ?
value wird als Abkürzung verwendet, die jQuery anweist, die Funktion aufzurufen, die als Parameter des übergeben wird getJSON ()
Funktion. Sie könnten das ersetzen ?
mit dem Namen einer anderen Funktion, wenn Sie diese Verknüpfung nicht verwenden möchten.
Im Folgenden wird auf eine Webseite mit der Flickr-JSONP-API zugegriffen, wobei die neuesten mit "resig" gekennzeichneten Fotos angezeigt werden. Beachten Sie, dass ich die ?
Abkürzung, so dass jQuery einfach die Rückruffunktion aufrufen wird, die ich bereitgestellt habe getJSON ()
Funktion. Der an die Rückruffunktion übergebene Parameter sind die angeforderten JSON-Daten.
Anmerkungen: Stellen Sie sicher, dass Sie die API des von Ihnen verwendeten Dienstes auf korrekte Verwendung des Rückrufs überprüfen. Als Beispiel verwendet Flickr den Namen jsoncallback =?
während Yahoo! und Digg verwenden den Namen callback =?
.
Bei einer XHR-Anforderung speichert Internet Explorer die Antwort zwischen. Wenn die Antwort statische Inhalte mit einer langen Haltbarkeitsdauer enthält, kann das Zwischenspeichern eine gute Sache sein. Wenn der angeforderte Inhalt jedoch dynamisch ist und von Sekunde zu Sekunde geändert werden kann, sollten Sie sicherstellen, dass die Anforderung nicht vom Browser zwischengespeichert wird. Eine mögliche Lösung besteht darin, einen eindeutigen Abfragezeichenfolgenwert an das Ende der URL anzuhängen. Dadurch wird sichergestellt, dass der Browser für jede Anforderung eine eindeutige URL anfordert.
// Fügen Sie am Ende der URL-URL eine eindeutige Abfragezeichenfolge hinzu: 'some? Nocache =' + (newDate ()). GetTime ()
Eine andere Lösung, die eher eine globale Lösung ist, besteht darin, alle AJAX-Anforderungen standardmäßig so zu konfigurieren, dass sie die soeben diskutierte No-Cache-Logik enthalten. Verwenden Sie dazu die AjaxSetup
Funktion, um das Caching global auszuschalten.
$ .ajaxSetup (cache: false // ist standardmäßig aktiviert. False bedeutet, dass die Zwischenspeicherung deaktiviert ist.);
Um diese globale Einstellung mit einzelnen XHR-Anforderungen zu überschreiben, ändern Sie einfach die Cache-Option bei Verwendung von Ajax ()
Funktion. Nachfolgend finden Sie ein codiertes Beispiel für die Durchführung einer XHR-Anfrage mit der Ajax ()
Funktion, die die globale Einstellung überschreibt und die Anforderung zwischenspeichert.
$ .ajaxSetup (cache: false // ist standardmäßig aktiviert. False bedeutet, dass die Zwischenspeicherung deaktiviert ist.); jQuery.ajax (cache: true, url: 'some', Typ: 'POST');