Skip to content
the poor coder

axios get error response message

Poor Man
Published
Reading time
2 min read
On this page

How to Handle Error Responses in Axios GET Request#

When making a GET request using Axios, it's important to handle any error responses that you might encounter. This can help to prevent unexpected behavior and make your application more robust. Here's how you can handle error responses in Axios GET request:

Method 1: Using .catch() method#

The simplest way to handle error responses in Axios GET request is by using the .catch() method. This method is called when there is an error in the request or when the server returns an error response. Here's an example:

Text

axios.get('https://example.com/api/data')
  .then(response => {
    // handle successful response
    console.log(response.data);
  })
  .catch(error => {
    // handle error response
    console.log(error.response.data);
  });

In the above example, we are making a GET request to 'https://example.com/api/data'. If the request is successful, we log the response data to the console. If there is an error in the request or if the server returns an error response, we log the error response data to the console.

Method 2: Using async/await with try/catch#

You can also handle error responses in Axios GET request using async/await with try/catch block. Here's an example:

Text

async function getData() {
  try {
    const response = await axios.get('https://example.com/api/data');
    // handle successful response
    console.log(response.data);
  } catch (error) {
    // handle error response
    console.log(error.response.data);
  }
}

In the above example, we are defining an async function getData() and calling axios.get() inside it. We are using try/catch block to handle the response and error. If the request is successful, we log the response data to the console. If there is an error in the request or if the server returns an error response, we log the error response data to the console.

Method 3: Creating a custom Axios instance#

You can also create a custom Axios instance and define the error handling behavior globally. Here's an example:

Text

const api = axios.create({
  baseURL: 'https://example.com/api/',
});

api.interceptors.response.use(
  response => {
    return response;
  },
  error => {
    // handle error response
    console.log(error.response.data);
    return Promise.reject(error);
  },
);

api.get('data')
  .then(response => {
    // handle successful response
    console.log(response.data);
  });

In the above example, we are creating a custom Axios instance using axios.create() and defining the baseURL as 'https://example.com/api/'. We are also defining an interceptor using api.interceptors.response.use() method which is called for every response. If there is an error in the response, we log the error response data to the console and return a rejected Promise. If the request is successful, we log the response data to the console.

These are some of the ways you can handle error responses in Axios GET request. Choose the one that suits your application requirements.

Keep going

2023

how to sort an array

How to Sort an Array If you have an array and you want to order its elements in a specific way, you need to use a sorting algorithm. There are several sorting algorithms available, but two of the most commonly used are…

javascript2 min read
2023

jquery mobile or desktop

jQuery Mobile or Desktop? As a web developer, I have had some experience with both jQuery Mobile and jQuery Desktop. Both frameworks have their pros and cons, and which one to use really depends on the specific project…

javascript1 min read
2023

node.js folder structure

Node.js Folder Structure If you are new to Node.js, it can be daunting to create a folder structure that will work for your project. The structure you choose will depend on the size and complexity of your project. Here…

javascript1 min read
ESC