XHR的属性

最新推荐文章于 2023-05-30 21:27:40 发布

树根朽木

最新推荐文章于 2023-05-30 21:27:40 发布

阅读量1.4k

点赞数

分类专栏： Javascript学习

本文链接：https://blog.csdn.net/jiaoqi6132/article/details/104457660

版权

Javascript学习专栏收录该内容

26 篇文章 0 订阅

订阅专栏

标准属性

`1.XMLHttpRequest.onreadystatechange`

当 readyState 属性发生变化时调用的 EventHandler。

语法：

只要 readyState 属性发生变化，就会调用相应的处理函数。这个回调函数会被用户线程所调用。XMLHttpRequest.onreadystatechange 会在 XMLHttpRequest 的readyState 属性发生改变时触发 readystatechange 事件的时候被调用。

当 readyState 的值改变的时候，callback 函数会被调用。

位置:

var xhr= new XMLHttpRequest(),
    method = "GET",
    url = "https://developer.mozilla.org/";

xhr.open(method, url, true);
xhr.onreadystatechange = function () {
  if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
    console.log(xhr.responseText)
  }
}
xhr.send();

这实际是方法。用回调函数定义。

`2.XMLHttpRequest.readyState` 只读

返回一个无符号短整型（unsigned short）数字，代表请求的状态码。

XMLHttpRequest.readyState 属性返回一个 XMLHttpRequest 代理当前所处的状态。一个 XHR 代理总是处于下列状态中的一个。

语法：

`0`	`UNSENT`	代理被创建，但尚未调用 open() 方法。
`1`	`OPENED`	`open()` 方法已经被调用。
`2`	`HEADERS_RECEIVED`	`send()` 方法已经被调用，并且头部和状态已经可获得。
`3`	`LOADING`	下载中； `responseText` 属性已经包含部分数据。
`4`	`DONE`	下载操作已完成。

UNSENT

XMLHttpRequest 代理已被创建，但尚未调用 open() 方法。

OPENED

open() 方法已经被触发。在这个状态中，可以通过 setRequestHeader() 方法来设置请求的头部，可以调用 send() 方法来发起请求。

HEADERS_RECEIVED

send() 方法已经被调用，响应头也已经被接收。

LOADING

响应体部分正在被接收。如果 responseType 属性是“text”或空字符串， responseText 将会在载入的过程中拥有部分响应数据。

DONE

请求操作已经完成。这意味着数据传输已经彻底完成或失败。

位置：

var xhr = new XMLHttpRequest();
console.log('UNSENT', xhr.readyState); // readyState 为 0

xhr.open('GET', '/api', true);
console.log('OPENED', xhr.readyState); // readyState 为 1

xhr.onprogress = function () {
    console.log('LOADING', xhr.readyState); // readyState 为 3
};

xhr.onload = function () {
    console.log('DONE', xhr.readyState); // readyState 为 4
};

xhr.send(null);

`3.XMLHttpRequest.response` 只读

返回一个 ArrayBuffer、Blob、Document，或 DOMString，具体是哪种类型取决于 XMLHttpRequest.responseType 的值。其中包含整个响应体（response body）。

The XMLHttpRequest response 属性返回响应的正文。返回的类型可以是 ArrayBuffer 、 Blob 、 Document 、 JavaScript Object 或 DOMString 。这取决于 responseType 属性。

语法：

var body = XMLHttpRequest.response;

值	描述
`""`	将 `responseType` 设为空字符串与设置为`"text"`相同，是默认类型（实际上是 `DOMString`）。
`"arraybuffer"`	`response` 是一个包含二进制数据的 JavaScript `ArrayBuffer` 。
`"blob"`	`response` 是一个包含二进制数据的 `Blob` 对象。
`"document"`	`response` 是一个 HTML `Document` 或 XML `XMLDocument` ，这取决于接收到的数据的 MIME 类型。请参阅 HTML in XMLHttpRequest 以了解使用 XHR 获取 HTML 内容的更多信息。
`"json"`	`response` 是一个 JavaScript 对象。这个对象是通过将接收到的数据类型视为 JSON 解析得到的。
`"text"`	`response` 是包含在 `DOMString` 对象中的文本。
`"moz-chunked-arraybuffer"`	与`"arraybuffer"`相似，但是数据会被接收到一个流中。使用此响应类型时，响应中的值仅在 `progress` 事件的处理程序中可用，并且只包含上一次响应 `progress` 事件以后收到的数据，而不是自请求发送以来收到的所有数据。在 `progress` 事件处理时访问 `response` 将返回到目前为止收到的数据。在 `progress` 事件处理程序之外访问， `response` 的值会始终为 `null` 。
`"ms-stream"`	`response` 是下载流的一部分；此响应类型仅允许下载请求，并且仅受Internet Explorer支持。

`4.XMLHttpRequest.responseText` 只读

返回一个 DOMString，该 DOMString 包含对请求的响应，如果请求未成功或尚未发送，则返回 null。

XMLHttpRequest.responseText 在一个请求被发送后，从服务器端返回文本。

语法：

var resultText = XMLHttpRequest.responseText;

`5.XMLHttpRequest.responseType`

这个type既可以用来指定，要接受的格式，又可以显示，当前的格式。

一个用于定义响应类型的枚举值（enumerated value）。

XMLHttpRequest.responseType 属性是一个枚举类型的属性，返回响应数据的类型。它允许我们手动的设置返回数据的类型。如果我们将它设置为一个空字符串，它将使用默认的"text"类型。

`6.XMLHttpRequest.responseURL` 只读

返回响应的序列化（serialized）URL，如果该 URL 为空，则返回空字符串。

只读属性XMLHttpRequest.responseURL返回响应的序列化URL，如果URL为空则返回空字符串。如果URL有锚点，则位于URL # 后面的内容会被删除。如果URL有重定向， responseURL 的值会是经过多次重定向后的最终 URL 。

语法：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/test', true);
xhr.onload = function () {
  console.log(xhr.responseURL); // http://example.com/test
};
xhr.send(null);

`7.XMLHttpRequest.responseXML` 只读

返回一个 Document，其中包含该请求的响应，如果请求未成功、尚未发送或时不能被解析为 XML 或 HTML，则返回 null。

XMLHttpRequest.responseXML 属性是一个只读值，它返回一个包含请求检索的HTML或XML的Document，如果请求未成功，尚未发送，或者检索的数据无法正确解析为 XML 或 HTML，则为 null。默认是当作“text / xml” 来解析。当 responseType 设置为 “document” 并且请求已异步执行时，响应将被当作 “text / html” 来解析。responseXML 对于任何其他类型的数据以及 data: URLs 为 null。

var data = XMLHttpRequest.responseXML;

var xhr = new XMLHttpRequest();
xhr.open('GET', '/server', true);

// 如果已指明，responseType 必须是空字符串或 "document" 
xhr.responseType = 'document';

// overrideMimeType() 用来强制解析 response 为 XML
xhr.overrideMimeType('text/xml');

xhr.onload = function () {
  if (xhr.readyState === xhr.DONE) {
    if (xhr.status === 200) {
      console.log(xhr.response);
      console.log(xhr.responseXML);
    }
  }
};

xhr.send(null);

`8.XMLHttpRequest.status` 只读

返回一个无符号短整型（unsigned short）数字，代表请求的响应状态。

位置：

var xhr = new XMLHttpRequest();
console.log('UNSENT', xhr.status);

xhr.open('GET', '/server', true);
console.log('OPENED', xhr.status);

xhr.onprogress = function () {
  console.log('LOADING', xhr.status);
};

xhr.onload = function () {
  console.log('DONE', xhr.status);
};

xhr.send(null);

`9.XMLHttpRequest.statusText` 只读

返回一个 DOMString，其中包含 HTTP 服务器返回的响应状态。与 XMLHTTPRequest.status 不同的是，它包含完整的响应状态文本（例如，"200 OK"）。

注意：根据 HTTP/2 规范（8.1.2.4 Response Pseudo-Header Fields，响应伪标头字段），HTTP/2 没有定义任何用于携带 HTTP/1.1 状态行中包含的版本或原因短语的方法。

只读属性 XMLHttpRequest.statusText 返回了XMLHttpRequest 请求中由服务器返回的一个DOMString 类型的文本信息，这则信息中也包含了响应的数字状态码。不同于使用一个数字来指示的状态码XMLHTTPRequest.status，这个属性包含了返回状态对应的文本信息，例如"OK"或是"Not Found"。如果请求的状态readyState的值为"UNSENT"或者"OPENED"，则这个属性的值将会是一个空字符串。
 
如果服务器未明确指定一个状态文本信息，则statusText的值将会被自动赋值为"OK"。

`10.XMLHttpRequest.timeout`

一个无符号长整型（unsigned long）数字，表示该请求的最大请求时间（毫秒），若超出该时间，则请求会自动结束。

XMLHttpRequest.timeout 是一个无符号长整型数，代表着一个请求在被自动终止前所消耗的毫秒数。默认值为 0，意味着没有超时。超时并不应该用在一个 document environment 中的同步 XMLHttpRequests 请求中，否则将会抛出一个 InvalidAccessError 类型的错误。当超时发生， timeout 事件将会被触发。

var xhr = new XMLHttpRequest();
xhr.open('GET', '/server', true);

xhr.timeout = 2000; // 超时时间，单位是毫秒

xhr.onload = function () {
  // 请求完成。在此进行处理。
};

xhr.ontimeout = function (e) {
  // XMLHttpRequest 超时。在此做某事。
};

xhr.send(null);

`11.XMLHttpRequestEventTarget.ontimeout`

当请求超时调用的 EventHandler。

`13.XMLHttpRequest.upload` 只读

XMLHttpRequestUpload，代表上传过程。

XMLHttpRequest.upload 属性返回一个 XMLHttpRequestUpload对象，用来表示上传的进度。这个对象是不透明的，但是作为一个XMLHttpRequestEventTarget，可以通过对其绑定事件来追踪它的进度。

可以被绑定在upload对象上的事件监听器如下：

事件	相应属性的信息类型
`onloadstart`	获取开始
`onprogress`	数据传输进行中
`onabort`	获取操作终止
`onerror`	获取失败
`onload`	获取成功
`ontimeout`	获取操作在用户规定的时间内未完成
`onloadend`	获取完成（不论成功与否）

`14.XMLHttpRequest.withCredentials`

一个布尔值，用来指定跨域 Access-Control 请求是否应带有授权信息，如 cookie 或授权 header 头。

XMLHttpRequest.withCredentials 属性是一个Boolean类型，它指示了是否该使用类似cookies,authorization headers(头部授权)或者TLS客户端证书这一类资格证书来创建一个跨站点访问控制（cross-site Access-Control）请求。在同一个站点下使用withCredentials属性是无效的。

此外，这个指示也会被用做响应中cookies 被忽视的标示。默认值是false。

如果在发送来自其他域的XMLHttpRequest请求之前，未设置withCredentials 为true，那么就不能为它自己的域设置cookie值。而通过设置withCredentials 为true获得的第三方cookies，将会依旧享受同源策略，因此不能被通过document.cookie或者从头部相应请求的脚本等访问。

注: 永远不会影响到同源请求

Note: 不同域下的XmlHttpRequest 响应，不论其Access-Control- header 设置什么值，都无法为它自身站点设置cookie值，除非它在请求之前将withCredentials 设为true。

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/', true);
xhr.withCredentials = true;
xhr.send(null);

非标准属性

`15.XMLHttpRequest.channel`只读

nsIChannel，对象在执行请求时使用的通道。

XMLHttpRequest.channel是nsIChannel对象在执行请求时使用的。这是null尚未创建通道的情况。对于多部分请求，这是初始通道，而不是多部分请求中的不同部分。需要提升的特权才能访问。

`16.XMLHttpRequest.mozAnon`只读

一个布尔值，如果为真，请求将在没有cookie和身份验证header头的情况下发送。

mozSystem是一个布尔值。如果为true，则不会对请求执行相同的原始策略。

`17.XMLHttpRequest.mozSystem`只读

一个布尔值，如果为真，则在请求时不会强制执行同源策略。

XMLHttpRequest.mozBackgroundRequest是一个布尔值，指示对象是否表示后台服务请求。如果为true，则没有负载组与请求相关联，并阻止了安全对话框显示给用户。

在通常会显示安全对话框（例如身份验证或错误的证书通知）的情况下，该请求将失败。

`18.XMLHttpRequest.mozBackgroundRequest`

一个布尔值，它指示对象是否是后台服务器端的请求。

树根朽木

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
XHR的属性

标准属性1.XMLHttpRequest.onreadystatechange当 readyState 属性发生变化时调用的EventHandler。语法：只要 readyState 属性发生变化，就会调用相应的处理函数。这个回调函数会被用户线程所调用。XMLHttpRequest.onreadystatechange 会在 XMLHttpRequest 的readyState...
复制链接

扫一扫