Question

在jQuery ajax函数中有xhr选项。有人知道此选项的更多详细信息，可用性或样本用法吗？

Answer 1

我知道这是一个古老而古老的问题，但我只是在寻找这个并希望发布这个，以便下一个人了解正在发生的事情。

对于此功能，您希望为浏览器返回适当的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。他们创建了一个指向api.twitter.com的IFRAME，只需将document.domain设置为"twitter.com"。他们也在主页中将document.domain设置为"twitter.com"。

然后，他们的JS在发出HTTP请求时，只是从IFRAME而不是主页创建它。通过同源策略获取它们。

您可以使用$ .ajax（）的xhr选项执行此操作。这是一个片段（假设此代码在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设置为相同的值，它就会起作用。（这是一个hackish例子：它在某些IE版本中不起作用，因为我作弊并且只使用了标准的XMLHttpRequest对象 - 你需要修复它。）

希望有所帮助。

（编辑添加：这是旧浏览器所必需的技术 - 大多数现代浏览器中的CORS支持都会使这变得不必要）

Sujal

Answer 2

另一个迟到的答案，但下面的代码是您覆盖xhr选项时可以执行的操作的一个很好的示例。 This is taken from Ben Nolan's blog它允许您跟踪xhr get的进度。我在加载大型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)
}

Answer 3

事实上，someone does know。

xhr选项允许您定义自己的回调，以创建将在ajax()调用的幕后使用的XMLHttpRequest对象。在几乎所有情况下，您都不需要指定此选项。

Answer 4

http://api.jquery.com/是你的朋友。搜索ajax（）命令时从该站点：

xhr（Function）：用于创建XMLHttpRequest对象的回调。可用时默认为ActiveXObject（IE），否则为XMLHttpRequest。重写以提供您自己的XMLHttpRequest实现或对工厂的增强。它在jQuery 1.2.6和任何早期版本中都不可用。

一般来说，除非你知道你在做什么，否则你真的不会使用$ .ajax（）函数的这个函数

jQuery ajax（）选项 - xhr

4 个答案: