jQuery ajax() opcja - xhr

Question

W funkcji ajax jQuery dostępna jest opcja xhr. Czy ktoś wie więcej szczegółów, użyteczności lub użycia próbki tej opcji?

Answer 1

W rzeczywistości someone does know $ .ajax().

Opcja xhr umożliwia zdefiniowanie własnego wywołania zwrotnego do tworzenia obiektu XMLHttpRequest, który będzie używany za kulisami w rozmowie ajax(). W niemal każdym pojedynczym przypadku nie trzeba określać tej opcji.

Answer 2

http://api.jquery.com/ jest twoim przyjacielem. Z tej strony podczas wyszukiwania polecenia ajax():

xhr (Funkcja): Oddzwonienie do tworzenia obiektu XMLHttpRequest. Domyślnie jest to ActiveXObject, gdy jest dostępny (IE), inaczej XMLHttpRequest. Zastąpienie, aby zapewnić własną implementację XMLHttpRequest lub rozszerzeń do fabryki.Jest on niedostępny w jQuery 1.2.6 iw dowolnej wczesnej wersji.

Generalnie, chyba że wiesz co robisz, na pewno nie będzie używać tej funkcji z funkcją

Answer 3

wiem, że to jest stare, stare pytanie, ale ja po prostu szukając tego i chce pisać to więc następna osoba rozumie, co się dzieje.

W przypadku tej funkcji należy zwrócić odpowiedni obiekt XHR do przeglądarki. Domyślnym zachowaniem jest użycie XMLHTTPRequest lub równoważnika IE. Oto domyślne zachowanie:

jQuery.ajaxSettings.xhr = window.ActiveXObject ? 
/* Microsoft failed to properly 
* implement the XMLHttpRequest in IE7 (can't request local files), 
* so we use the ActiveXObject when it is available 
* Additionally XMLHttpRequest can be disabled in IE7/IE8 so 
* we need a fallback. 
*/ 
function() { 
    return !this.isLocal && createStandardXHR() || createActiveXHR(); 
} : 
// For all other browsers, use the standard XMLHttpRequest object 
createStandardXHR; 

Te dwie metody tworzenia createStandardXHR i createActiveXHR zasadniczo nazwać podstawowe metody tworzenia XHR mamy wszystkie znane i lubiane od lat. Oto createStandardXHR:

function createStandardXHR() { 
try { 
    return new window.XMLHttpRequest(); 
} catch(e) {} 
} 

Tak więc, jeśli chcesz to zmienić, można po prostu przejść w swojej własnej funkcji, która zwraca new XMLHttpRequest() obiekt.

Dlaczego chcesz to zrobić? Załóżmy, że musisz utworzyć żądanie HTTP o wielu domenach i użyć podkładki IFRAME, aby działało przy użyciu document.domain, aby działało zgodnie z tymi samymi regułami pochodzenia. Jest to dobry sposób, aby twój javascript załadował obiekt XHR z poprawnej ramki na podstawie domeny, z którą chcesz rozmawiać.

Twitter.com używa tej techniki.

JavaScript działa na http://twitter.com/, ale dane są podane na http://api.twitter.com. Tworzą one ramkę IFRAME wskazującą na api.twitter.com, która po prostu ustawia document.domain na "twitter.com". Ustawili też na stronie głównej document.domain na "twitter.com".

Następnie ich JS, przy żądaniach HTTP, po prostu tworzy go z IFRAME zamiast strony głównej. Pobiera je za pomocą zasad tego samego pochodzenia.

Możesz to zrobić za pomocą opcji xhr do $ .ajax(). Oto fragment (wyobrazić ten kod działa na stronie w http://myapp.com):

$.ajax({url: "http://api.myapp.com", xhr: function(){ 
    return new ($('#my_api_iframe')[0].contentWindow.XMLHttpRequest)(); 
}, success: function(html) { 
    // format and output result 
    } 
}); 

To będzie działać tak długo, jak obie strony głównej i iframe ustawił jeszcze document.domain do tej samej wartości.(To jest hackowy przykład: nie będzie działać w niektórych wersjach IE, ponieważ oszukałem i użyłem tylko standardowego obiektu XMLHttpRequest - musisz to naprawić.)

Nadzieję, że pomaga.

(edytowany dodać: jest to technika niezbędne dla starszych przeglądarek - wsparcie CORS w większości nowoczesnych przeglądarek byłoby to niepotrzebne)

Sujal

Answer 4

Innym późno odpowiedzi, ale poniżej kod jest doskonałym przykładem o tym, co możesz zrobić, gdy zastąpisz opcję xhr. This is taken from Ben Nolan's blog Umożliwia śledzenie postępów zdobywania xhr. Użyłem tego do utworzenia paska postępu podczas ładowania dużego zestawu danych JSON, dokładnie tego samego, dla którego go utworzył. Pomogło mi to tona.

interval = null 

$.ajax { 
    url : "endpoint.json" 

    dataType : 'json' 

    xhr :() => 
    xhr = jQuery.ajaxSettings.xhr() 

    interval = setInterval(=> 
     if xhr.readyState > 2 
     total = parseInt(xhr.getResponseHeader('Content-length')) 
     completed = parseInt(xhr.responseText.length) 
     percentage = (100.0/total * completed).toFixed(2) 

     console.log "Completed #{percentage}%" 
    , 50) 

    xhr 

    complete: -> 
    clearInterval(interval) 

    success : (data) => 
    alert(data) 
}