V𝗮𝗹𝗶𝗱𝗮𝘁ing 𝘂𝘀𝗲𝗿 𝗯𝗲𝗳𝗼𝗿𝗲 𝗮𝗻𝘆 𝗔𝗣𝗜 𝗰𝗮𝗹𝗹 𝘂𝘀𝗶𝗻𝗴 𝗔𝘅𝗶𝗼𝘀 𝗶𝗻𝘁𝗲𝗿𝗰𝗲𝗽𝘁𝗼𝗿𝘀

Interceptors are methods that are triggered before the main method

𝗦𝘁𝗲𝗽𝘀

1️⃣ Create Axios instance

let me tell you some benefits of creating an Axios instance

a. if you have multiple API calls, to the same endpoint, you specify baseURL and some headers properties which they in common to avoid
writing the same code multiple times

const instance = axios.create({
baseURL: '',
timeout: 1000,
headers: {'X-Custom-Header': 'foobar'}
});

what else hmmm 🤔 🤔 , let me know if you have some ideas in the comment section

2️⃣ 𝗔𝗱𝗱 𝗶𝗻𝘁𝗲𝗿𝗰𝗲𝗽𝘁𝗼𝗿𝘀 𝘁𝗼 𝗮 𝗰𝘂𝘀𝘁𝗼𝗺 𝗶𝗻𝘀𝘁𝗮𝗻𝗰𝗲 𝗼𝗳 𝗔𝘅𝗶𝗼𝘀

const instance = axios.create();
instance.interceptors.request.use(function () {/.../});

🔴 𝗪𝗲 𝗵𝗮𝘃𝗲 𝟮 𝘁𝘆𝗽𝗲𝘀 𝗼𝗳 𝗶𝗻𝘁𝗲𝗿𝗰𝗲𝗽𝘁𝗼𝗿𝘀

1️⃣ Request interceptor- Assume you want to confirm that your login information is accurate before submitting a request.

You can therefore verify at the interceptor level that your credentials are correct rather than making an actual API call.

If you need to add a token to each request performed, you can create an interceptor that does this for you rather than repeating the token addition logic at each Axios call.

2️⃣ Response interceptor- response interceptors accept two function arguments: the first function is when the response that comes back is a 200 status HTTP response, and the second function is when it’s a status code that falls outside of the 200 range