Issue Retrieving Token to send in Header within React Component

[nsena]

I am using react with auth0-spa-js.
From following the auth0-spa-js tutorials, I learned to use the “react-auth0-wrapper” from the tutorial here.

In trying to add an accessToken to requests within a component I have made, I am getting the error:

Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.

on this particular line:

export const useAuth0 = () => useContext(Auth0Context);

within the react-auth0-wrapper.

How else can I use the .getTokenSilently() method or any similar method with auth0-spa-js

[dan.woda]

Hi @nsena,

I am not a react expert, but it looks like this could be due to a few simple things, or could be related to where the hook is being called. Did you try the common issues outlined here:

Invalid Hook Call Warning – React

I haven’t seen this before, not saying it isn’t auth0 related, but it sounds like a react specific problem.

If this doesn’t fix it we can dive in deeper. Hope this helps!

Thanks,
Dan