How to Implement Global Axios Interceptors for API Requests?

[Jad31]

Hello,

I'm currently working on a project where we need to ensure that every API request sent via Axios includes a Bearer token in the Authorization header. I understand that using Axios interceptors could be a solution for this.

What I want to achieve:
Automatically attach an Authorization header with a Bearer token to every outgoing Axios request across the application.

What I've tried:
I've started looking into Axios interceptors but am unsure how to implement them globally so that they apply to all requests without having to manually attach them for each API call.

OpenAPI.interceptors.request.use(async (request) => {
    const accessToken = ...;
    if (request.headers) {
        request.headers.Authorization = `Bearer ${accessToken}`;
    }
    return request;
});

My question:
Could anyone share how to set up global interceptors in Axios for this purpose, or is there a better approach to achieving this kind of authentication handling?

Thank you for your assistance!

[mrlubos]

Hey, please see #505 (reply in thread) and https://blog.logrocket.com/using-axios-set-request-headers/#:~:text=We%20can%20also%20use%20Axios,it%20is%20delivered%20to%20callbacks.

[Jad31]

Thank you!