How can I use Axios interceptors in my React Native app?

How can I use Axios interceptors in my React Native app?

You can use Axios interceptors to intercept requests or responses before they are handled by then or catch. This is useful for adding headers, logging, or handling errors globally.

Can you show me a code example of setting up an interceptor?

Sure! Here's a simple example:

import axios from 'axios';

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

instance.interceptors.request.use(config => {
    // Modify request config before sending it
    config.headers['Authorization'] = 'Bearer token';
    return config;
}, error => {
    return Promise.reject(error);
});

instance.interceptors.response.use(response => {
    // Handle response data
    return response;
}, error => {
    // Handle response error
    console.error('Error:', error);
    return Promise.reject(error);
});

This sets up a request interceptor to add an authorization token and a response interceptor to log errors.

What if I want to handle errors differently based on the status code?

You can check the status code in the response interceptor and handle it accordingly. For example:

instance.interceptors.response.use(response => {
    return response;
}, error => {
    if (error.response) {
        switch (error.response.status) {
            case 401:
                // Handle unauthorized error
                break;
            case 404:
                // Handle not found error
                break;
            default:
                // Handle other errors
        }
    }
    return Promise.reject(error);
});