xhr的readyState和status

XMLHttpRequest（XHR）对象中的readyState和status用于监控异步 HTTP 请求的状态。它们分别表示请求的当前阶段和服务器的响应状态。

readyState 用于判断请求所处的阶段，确保数据完全接收。
status 用于判断请求的结果状态（如200表示成功，404表示资源不存在）。

文章目录

- readyState 属性
- status 属性
- - 1xx: 信息性状态码
  - 2xx: 成功状态码
  - 3xx: 重定向状态码
  - 4xx: 客户端错误状态码
  - 5xx: 服务器错误状态码
- 例子

readyState 属性

readyState 属性表示请求的当前状态，取值范围从 0 到 4。每个值的含义如下：

0: UNSENT
请求未初始化，尚未调用 open() 方法。
1: OPENED
请求已被初始化，调用了 open() 方法，但尚未调用 send() 方法。
2: HEADERS_RECEIVED
请求已发送，服务器响应头已被接收，但响应体尚未接收。
3: LOADING
响应体正在接收中。可以接收到部分数据。
4: DONE
```
  请求操作已经完成。这意味着数据传输已经彻底完成或失败。
```
请求已完成，响应已完全接收。此时可以通过 responseText 或 responseXML 属性访问响应数据。

在这里插入图片描述

status 属性

1xx:信息响应类，这些状态码表示请求已被接收并正在继续处理。
2xx:处理成功响应类，这些状态码表示请求已成功处理。
3xx:重定向响应类，这些状态码表示客户端需要进一步的操作才能完成请求。
4xx:客户端错误，这些状态码表示请求有误，客户端需修改请求。
5xx:服务端错误，这些状态码表示服务器在处理请求时发生了错误。

1xx: 信息性状态码

这些状态码表示请求已被接收并正在继续处理。

100 Continue
客户端应继续发送请求。通常用于在发送大型请求时，客户端可以先发送请求的头部，然后等待服务器的确认。
101 Switching Protocols
服务器已理解客户端的请求，并将其协议更改为客户端所请求的协议。

2xx: 成功状态码

这些状态码表示请求已成功处理。

200 OK
请求成功，服务器返回所请求的数据。
201 Created
请求成功并创建了新的资源，通常用于 POST 请求。
202 Accepted
请求已接受，但尚未处理。此状态通常用于异步处理。
203 Non-Authoritative Information
服务器成功处理了请求，但返回的信息可能来自另一来源。
204 No Content
```
  在更新一个资源后，如果不需要向客户端返回任何新的数据
```
请求成功，但没有返回任何内容，常用于 DELETE 请求。
205 Reset Content
请求成功，要求客户端重置文档视图。
206 Partial Content
服务器成功处理了部分 GET 请求，通常用于下载大文件时的断点续传。

3xx: 重定向状态码

这些状态码表示客户端需要进一步的操作才能完成请求。

300 Multiple Choices
请求的资源有多种选择，用户可以选择其中一个。
301 Moved Permanently
请求的资源已被永久移动到新 URI，未来的请求应使用新 URI。
302 Found
请求的资源临时移动到新 URI，客户端应继续使用原 URI。
303 See Other
请求的响应可在另一个 URI 下找到，客户端应使用 GET 方法请求该 URI。
304 Not Modified
资源未修改，可以使用缓存的版本。常用于条件请求。
305 Use Proxy
请求的资源必须通过代理访问。
307 Temporary Redirect
请求的资源临时移动到新 URI，客户端应使用相同的方法进行请求。
308 Permanent Redirect
请求的资源已被永久移动，未来请求应使用新 URI，且应使用相同的方法进行请求。

4xx: 客户端错误状态码

这些状态码表示请求有误，客户端需修改请求。

400 Bad Request
请求无效，服务器无法理解。
401 Unauthorized
请求未授权，需提供身份验证。
402 Payment Required
该状态码保留用于将来的需求，目前尚未广泛使用。
403 Forbidden
服务器理解请求，但拒绝执行，用户无权访问请求的资源。
404 Not Found
请求的资源未找到。
405 Method Not Allowed
请求方法不被允许，资源不支持该方法。
406 Not Acceptable
请求的资源无法满足请求头中指定的条件。
407 Proxy Authentication Required
需要代理身份验证。
408 Request Timeout
服务器在等待请求时超时。
409 Conflict
请求无法完成，因为存在冲突。
410 Gone
请求的资源已被永久删除，且没有转发地址。
411 Length Required
服务器要求请求中指定 Content-Length。
412 Precondition Failed
请求中的某个条件未满足。
413 Payload Too Large
请求的有效负载太大，服务器无法处理。
414 URI Too Long
请求的 URI 太长，服务器无法处理。
415 Unsupported Media Type
请求的媒体类型不被服务器支持。
416 Range Not Satisfiable
请求的范围无效，服务器无法满足请求。
417 Expectation Failed
服务器无法满足 Expect 请求头中的期望。

5xx: 服务器错误状态码

这些状态码表示服务器在处理请求时发生了错误。

500 Internal Server Error
服务器发生意外错误，无法完成请求。
501 Not Implemented
服务器不支持请求的方法。
502 Bad Gateway
服务器作为网关或代理时收到无效响应。
503 Service Unavailable
服务器当前无法处理请求，通常是由于过载或维护。
504 Gateway Timeout
服务器作为网关或代理时，未能及时从上游服务器获取请求。

例子

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://api.example.com/data', true);

xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) { // DONE
        switch (xhr.status) {
            case 200:
                console.log('Success:', xhr.responseText);
                break;
            case 404:
                console.error('Error 404: Not Found');
                break;
            case 500:
                console.error('Error 500: Internal Server Error');
                break;
            default:
                console.error('Error:', xhr.status, xhr.statusText);
        }
    }
};

xhr.send();