jQuery Kort gezegd jQuery en Ajax

De functie jQuery ajax () is de abstractie op het laagste niveau

De jQuery Ajax() functie is het laagste abstractieniveau dat beschikbaar is voor XMLHttpRequests (ook bekend als AJAX). Alle andere jQuery AJAX-functies, zoals laden(), gebruik maken van de Ajax() functie. De ... gebruiken Ajax() functie biedt de grootste functionaliteit die beschikbaar is voor XMLHttpRequests. jQuery biedt ook andere abstracties op een hoger niveau voor het doen van zeer specifieke soorten XMLHttpRequests. Deze functies zijn in essentie snelkoppelingen voor de Ajax() methode.

Deze snelkoppelingsmethoden zijn:

  • laden()
  • krijgen()
  • getJSON ()
  • getScript ()
  • post()

Het punt om mee te nemen is dat, hoewel de snelkoppelingen soms leuk zijn, ze allemaal worden gebruikt Ajax() Achter de schermen. En als u alle functies en aanpassingen wilt die jQuery biedt als het op AJAX aankomt, moet u gewoon de Ajax() methode.

Opmerkingen: Standaard is de Ajax() en laden() AJAX-functies gebruiken beide KRIJGEN HTTP-protocol.


jQuery ondersteunt cross-domein JSONP

JSON met opvulling (JSONP) is een techniek waarmee de afzender van een HTTP-verzoek, waarbij JSON wordt geretourneerd, een naam kan opgeven voor een functie die wordt aangeroepen met het JSON-object als een parameter van de functie. Deze techniek maakt geen gebruik van XHR. Het maakt gebruik van het scriptelement, zodat gegevens van elke site naar elke site kunnen worden verzonden. Het doel is om dezelfde bronbeleidsbeperkingen van XMLHttpRequest te omzeilen.

De ... gebruiken getJSON () jQuery-functie, kunt u JSON-gegevens uit een ander domein laden wanneer een JSONP-callbackfunctie aan de URL is toegevoegd. Als voorbeeld is hier wat een URL-aanvraag eruit zou zien met behulp van de Flickr API.

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

De ? waarde wordt gebruikt als een snelkoppeling waarmee jQuery de functie aanroept die wordt doorgegeven als een parameter van de getJSON () functie. Je zou de kunnen vervangen ? met de naam van een andere functie als u deze snelkoppeling niet wilt gebruiken.

Hieronder haal ik een webpagina binnen met behulp van de Flickr JSONP API, de meest recente foto's getagged met "resig." Merk op dat ik de ? snelkoppeling, zodat jQuery gewoon de callback-functie belt die ik de getJSON () functie. De parameter die wordt doorgegeven aan de callback-functie is de gevraagde JSON-gegevens.

       

Opmerkingen: Controleer de API van de service die u gebruikt voor het correcte gebruik van de terugroepactie. Flickr gebruikt bijvoorbeeld de naam jsoncallback =? terwijl Yahoo! en Digg gebruiken de naam callback =?.


Stop een browser van caching XHR-verzoeken

Wanneer u een XHR-aanvraag doet, slaat Internet Explorer het antwoord in de cache op. Als het antwoord statische inhoud met een lange houdbaarheid bevat, kan caching een goede zaak zijn. Als de gevraagde inhoud echter dynamisch is en per seconde kan worden gewijzigd, moet u ervoor zorgen dat de aanvraag niet in de cache van de browser wordt opgeslagen. Een mogelijke oplossing is om een ​​unieke querystringwaarde aan het einde van de URL toe te voegen. Dit zorgt ervoor dat de browser voor elke aanvraag om een ​​unieke URL vraagt.

 // Voeg een unieke querystring toe aan het einde van de URL van de URL: 'some? Nocache =' + (newDate ()). GetTime ()

Een andere oplossing, die meer een globale oplossing is, is om alle AJAX-verzoeken standaard in te stellen om de no-cache-logica te bevatten die we zojuist hebben besproken. Gebruik hiervoor de ajaxSetup functie om caching globaal uit te schakelen.

 $ .ajaxSetup (cache: false // True standaard. False betekent dat caching is uitgeschakeld.);

Nu, om deze globale instelling met individuele XHR-verzoeken te overschrijven, verandert u eenvoudig de cache-optie wanneer u de Ajax() functie. Hieronder is een gecodeerd voorbeeld van het doen van een XHR-verzoek met behulp van de Ajax() functie, die de globale instelling zal overschrijven en de aanvraag in de cache zal opslaan.

 $ .ajaxSetup (cache: false // True standaard. False betekent dat caching is uitgeschakeld.); jQuery.ajax (cache: true, url: 'some', type: 'POST');