一文吃透浏览器中的JS-HTTP响应代码

前端

2023-10-01 23:55:31

认识JavaScript和HTTP响应代码

JavaScript

JavaScript 是一种用于创建交互式网页的编程语言，广泛应用于 Web 开发。它可以处理用户输入、操作 HTML 和 CSS、调用 API 等。

HTTP 响应代码

HTTP 响应代码是服务器对客户端请求的回应，由三位数字组成。常见的 HTTP 响应代码包括：

200：请求成功
301：永久重定向
302：临时重定向
403：禁止访问
404：未找到
500：服务器内部错误

JavaScript操作HTTP响应代码

JavaScript可以通过多种方式来操作HTTP响应代码：

1. 使用XMLHttpRequest对象

XMLHttpRequest 对象是JavaScript中的内置对象，可以用来发送HTTP请求和处理响应。
以下示例展示如何使用XMLHttpRequest发送HTTP GET请求并处理响应：

var xhr = new XMLHttpRequest();

xhr.open("GET", "example.com");

xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    // 请求成功，处理响应
    console.log(xhr.responseText);
  }
};

xhr.send();

2. 使用fetch()方法

fetch()方法是ES6中引入的，用于发送HTTP请求并处理响应。
以下示例展示如何使用fetch()方法发送HTTP GET请求并处理响应：

fetch("example.com")
  .then(response => {
    if (response.ok) {
      // 请求成功，处理响应
      console.log(response.text());
    } else {
      // 请求失败，处理错误
      console.error('Error:', response.status);
    }
  })
  .catch(error => {
    // 请求失败，处理错误
    console.error('Error:', error);
  });

3. 使用库

还有一些JavaScript库可以帮助您轻松处理HTTP请求和响应，如axios、request等。
以下示例展示如何使用axios库发送HTTP GET请求并处理响应：

axios.get("example.com")
  .then(response => {
    // 请求成功，处理响应
    console.log(response.data);
  })
  .catch(error => {
    // 请求失败，处理错误
    console.error('Error:', error);
  });