Get okta's auth object on React axios request handler

Hi there fellow developers!

My name is Hugo, I am from sunny Portugal and I am currently developing a React SPA which I am trying to integrate with okta.

I have successfully implemented okta’s mechanisms to trigger unauthenticated access actions but I am having trouble adding the “Authorization: Bearer {token}” header so I can make authenticated calls to the back-end.

I have implemented an HTTP request handler to intercept all requests that axios will do but I am not understanding how I can access the auth object that I used before on my components with the withAuth wrapper. When I try to wrap my handler the same way axios functionality gets broken.

This is where I am right now:


import { withAuth } from “@okta/okta-react”;
const server = axios.create({
baseURL: “/api”

const requestHandler = withAuth(({ request, auth }) => {
const accessToken = auth.getAccessToken();
request.headers.common[“Authorization”] = "Bearer " + accessToken;
return request;
server.interceptors.request.use(request => requestHandler(request));


“react”: “^16.8.4”,
@okta/okta-react”: “^1.2.2”,
“axios”: “^0.18.0”,