网络技术问题 | JavaScript 课程测验 1 |问题 56

问题描述

在 JavaScript 中，如何使用 XMLHttpRequest 进行异步 HTTP 请求?

回答

XMLHttpRequest 对象允许通过 JavaScript 发起 HTTP 请求并获取服务器响应。它不需要刷新整个页面，可以在后台进行数据交互。下面是使用 XMLHttpRequest 进行异步 HTTP 请求的具体步骤:

1. 创建 XMLHttpRequest 对象。

   let xhr = new XMLHttpRequest();
   

2. 指定请求的方法、URL、以及是否异步处理请求。

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

3. 设置请求的 header 信息。

   xhr.setRequestHeader('Content-Type', 'application/json');
   

4. 发送请求。

   xhr.send();
   

5. 监听 XMLHttpRequest 对象的状态变化，并处理响应数据。

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

完整的示例代码如下所示：

let xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api/data', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send();
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        console.log(xhr.responseText);
    }
};

以上就是使用 XMLHttpRequest 进行异步 HTTP 请求的基本步骤。需要注意的是，如果需要进行 POST 请求或者需要带上 cookie 等信息，可以通过 XMLHttpRequest 的属性和方法进行相应配置。