Simple JavaScript Tutorial: How to Get HTTP Status Code

JavaScript Tutorial: How to get HTTP status code, specific code examples are required

Foreword:
In web development, data interaction with the server is often involved scene. When communicating with the server, we often need to obtain the returned HTTP status code to determine whether the operation is successful, and perform corresponding processing based on different status codes. This article will teach you how to use JavaScript to obtain HTTP status codes and provide some practical code examples.

1. Use the XMLHttpRequest object to obtain the status code

XMLHttpRequest is an HTTP request object, which can be used in JavaScript to interact with the server. The following is a sample code to obtain the HTTP status code:

let xhr = new XMLHttpRequest();

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

xhr.onreadystatechange = function() {
  if (xhr.readyState === XMLHttpRequest.DONE) {
    if (xhr.status === 200) {
      console.log('请求成功');
    } else {
      console.log('请求失败，状态码为：' + xhr.status);
    }
  }
};

xhr.send();

In the above code, we first create an XMLHttpRequest object, and then use the xhr.open method to specify the request method and address , and then monitor the change of request status through the xhr.onreadystatechange method. When xhr.readyState is XMLHttpRequest.DONE, the request has been completed.

Next, we obtained the HTTP status code returned by the server through xhr.status. If the status code is equal to 200, it means the request was successful; otherwise, it means the request failed.

2. Use Fetch API to obtain status code

Fetch API is a new feature of JavaScript, which provides a more modern and powerful way to interact with the server. The following is a sample code that uses the Fetch API to obtain the HTTP status code:

fetch('http://example.com/api')
  .then(response => {
    if (response.ok) {
      console.log('请求成功');
    } else {
      console.log('请求失败，状态码为：' + response.status);
    }
  })
  .catch(error => {
    console.log('请求发生错误：', error);
  });

In the above code, we use the fetch function of the Fetch API to initiate a GET request. Then process the server's response result through the .then method. If response.ok is true, it means the request is successful; otherwise, it means the request fails. The HTTP status code can be obtained through response.status.

In addition, we can also use the .catch method to catch errors during the request process.

3. Other common HTTP status code processing examples

In addition to 200, HTTP status codes have many other values, each value represents a different meaning. Here are some common HTTP status code handling examples:

• 301 Permanent redirect:

if (xhr.status === 301) {
  console.log('请求被永久重定向');
}

• 404 Page not found:

if (xhr.status === 404) {
  console.log('请求的页面不存在');
}

• 500 Server error:

if (xhr.status === 500) {
  console.log('服务器发生错误');
}

• 503 Service unavailable:

if (xhr.status === 503) {
  console.log('服务当前不可用');
}

Proceed accordingly according to different status codes , can better cope with different error situations.

Conclusion:
This article introduces how to use JavaScript to obtain the HTTP status code and provides some specific code examples. By mastering this knowledge, you will be able to better handle errors during interaction with the server and improve web development efficiency. Hope this article is helpful to you!

The above is the detailed content of Simple JavaScript Tutorial: How to Get HTTP Status Code. For more information, please follow other related articles on the PHP Chinese website!