JavaScript-XHR-深入理解

作者：System 时间：2024年08月10日分类：所有,ajax 字数：1078

这篇文章距离上次修改已过234天，其中的内容可能已经有所变动。

在JavaScript中，XHR即XMLHttpRequest对象用于与服务器交互。这是一种不需要刷新页面即可从服务器获取数据的技术。

创建一个新的XMLHttpRequest对象

var xhr = new XMLHttpRequest();

打开一个连接

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

这里的'GET'是HTTP请求方法，'https://api.example.com/data'是请求的URL，true意味着异步执行。

发送请求

xhr.send();

处理服务器回应

xhr.onreadystatechange = function () {
    if (xhr.readyState === 4) {
        if (xhr.status === 200) {
            console.log(xhr.responseText);
        } else {
            console.error(xhr.statusText);
        }
    }
};

readyState的值如下：

0：未初始化。请求对象被创建，但是尚未调用open方法。
1：载入。已经调用open方法，但是尚未发送请求。
2：发送。已经调用send方法，但是尚未接收到响应。
3：接收。已经开始接收部分响应数据。
4：完成。已经接收完全部响应数据，并且已经可以在客户端使用了。

status的值如下：

200：请求成功。
404：未找到。
500：服务器内部错误。

以上就是XMLHttpRequest对象的基本使用方法。

注意：现代的浏览器已经支持fetch API，这是一个更现代、更简洁的方式来处理HTTP请求。

JavaScript-XHR-深入理解

评论已关闭

推荐阅读