axios response

Axios Response

Axios is a popular JavaScript library used for making HTTP requests from a browser or node.js. It provides a simple and convenient API for sending and receiving data over the network. One of the essential features of Axios is the ability to handle responses.

What is an Axios response?

When an HTTP request is made using Axios, it returns a promise that resolves to a response object. This response object contains various properties and methods that provide information about the response received from the server.

Properties of the Axios response object

The Axios response object has several properties that can be accessed to get information about the response. Some of the commonly used properties are:

• data: This property contains the response data returned by the server. It can be an object, array, string, or any other data type depending on the response from the server.

• status: The HTTP status code of the response. It indicates whether the request was successful or not. For example, a status code of 200 indicates success, while a status code of 404 indicates that the requested resource was not found.

• statusText: A string representing the status text of the response. For example, if the status code is 200, the status text will be "OK."

• headers: An object containing the response headers.

• config: The config object that was used to make the request.

• request: The XMLHttpRequest object or the http.ClientRequest object used to make the request.

Example code

Here's an example that demonstrates how to make an HTTP request using Axios and access the response properties:

import axios from 'axios';

axios.get('
  .then(response => {
    console.log(response.data); // Output the response data
    console.log(response.status); // Output the status code
    console.log(response.statusText); // Output the status text
    console.log(response.headers); // Output the response headers
    console.log(response.config); // Output the request config
    console.log(response.request); // Output the XMLHttpRequest object
  })
  .catch(error => {
    console.error(error);
  });

In the above code, we make a GET request to the URL ' The.then()` method is called when the request is successful, and the response object is passed as an argument to the callback function. We can then access the response properties using dot notation.

Handling errors

Axios also provides a convenient way to handle errors that occur during the request. If the request fails or returns a status code that is not in the range of 2xx, the promise is rejected, and the .catch() method is called. The error object contains information about the error, including the response object if available.

Here's an example that demonstrates error handling using Axios:

import axios from 'axios';

axios.get('
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error.response.data); // Output the error response data
    console.error(error.response.status); // Output the error status code
    console.error(error.response.statusText); // Output the error status text
    console.error(error.response.headers); // Output the error response headers
  });

In the above code, the .catch() method is called when an error occurs. The error object contains a response property that can be used to access the error response properties.

Conclusion

In this article, we have explored the Axios response object and how to access its properties. The response object provides valuable information about the response received from the server, such as the response data, status code, and headers. Understanding how to handle responses is crucial when working with Axios, as it allows us to process the data returned by the server and handle errors effectively.