jQuery ajax() option - xhr

Question

В функции jQuery ajax есть опция xhr. Кто-нибудь знает более подробную информацию, удобство использования или выборку этого варианта?

Answer 1

В самом деле, someone does know.

Опция xhr позволяет определить свой собственный обратный вызов для создания объекта XMLHttpRequest, который будет использоваться за кулисами в вызове ajax(). В почти каждом отдельном случае вам не нужно указывать эту опцию.

Answer 2

http://api.jquery.com/ - твой друг. С этого сайта при поиске команды ajax():

xhr (Function): Обратный вызов для создания объекта XMLHttpRequest. По умолчанию для объекта ActiveXObject, если он доступен (IE), XMLHttpRequest в противном случае. Переопределите, чтобы предоставить свою собственную реализацию для XMLHttpRequest или усовершенствований на factory.It не доступны в jQuery 1.2.6 и в любой ранней версии.

Вообще, если вы не знаете, что вы делаете, вы действительно не будете использовать эту функцию функции $ .ajax()

Answer 3

Я знаю, что это старый, старый вопрос, но я просто искал это и хочу опубликовать его, чтобы следующий человек понял, что происходит.

Для этой функции вы хотите вернуть соответствующий объект XHR для своего браузера. По умолчанию используется использование XMLHTTPRequest или эквивалент IE. Вот поведение по умолчанию:

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; 

Те два метода создания createStandardXHR и createActiveXHR по существу назвать основные методы создания XHR мы все знали и любили в течение многих лет. Вот createStandardXHR:

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

Итак, если вы хотите изменить это, вы можете просто передать в своей собственной функции, которая возвращает объект new XMLHttpRequest().

Зачем вам это нужно? Предположим, вам нужно сделать HTTP-запрос с перекрестным доменом и использовать прорезь IFRAME, чтобы заставить его работать, используя document.domain для работы в рамках тех же правил происхождения. Это хороший способ, чтобы ваш javascript загружал объект XHR из правильного фрейма на основе того, с каким доменом вы хотите поговорить.

Twitter.com использует эту технику.

JavaScript работает на http://twitter.com/, но данные указаны в http://api.twitter.com. Они создают IFRAME, указывая на api.twitter.com, который просто устанавливает document.domain в "twitter.com". Они устанавливают document.domain на "twitter.com" на главной странице.

Затем их JS при выполнении HTTP-запросов просто создает его из IFRAME вместо главной страницы. Получает их в рамках политики одного происхождения.

Вы можете сделать это с помощью параметра xhr для $ .ajax(). Вот фрагмент (представьте себе этот код, работающий на странице в 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 
    } 
}); 

Это будет работать до тех пор, как на главной странице и IFrame установить их document.domain на ту же величину.(Это хакерский пример: он не будет работать в некоторых версиях IE, потому что я обманул и использовал только стандартный объект XMLHttpRequest - вам нужно будет исправить.)

Надеюсь, что это поможет.

(отредактированный, чтобы добавить: это техника, необходимая для старых браузеров - поддержка CORS в большинстве современных браузеров сделает это ненужным)

Sujal

Answer 4

Другой поздний ответ, но приведенный ниже код является отличным примером того, что вы можете сделать, когда вы переопределите параметр xhr. This is taken from Ben Nolan's blog Это позволяет отслеживать ход получения xhr. Я использовал это, чтобы создать индикатор выполнения при загрузке большого набора данных json, точно так же, как он его создал. Это помогло мне тонну.

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) 
}