Not getting correct token from Auth0 to React frontend to hand to fastapi backend

Hi there im trying to get my React front end to pass an access token to my fastapi backend which will verify it and then create a new user entry in my mongodb database.

Im trying to do it with an axios request to my fastapi backend like as below

This is my fastapi backend api code so far

Im getting this errow however: line 54, in verify_token
if key[“kid”] == unverified_header[“kid”]:
KeyError: ‘kid’

and when i check the token im getting from auth0 with it says invalid signature.

and whats decoded is : {
“alg”: “dir”,
“enc”: “A256GCM”,
“iss”: “https://“my tenant id””

So it looks like im not even getting the correct token back from the getAccessTokenSilently() function . Is my idea correct on passing the token back to fastapi to verify and if so am i passing the wrong thing back and using the wrong function from the react auth0 library?

Im finding it hard to follow the documenation but am i perhaps supposed to get and authorization code first from the authorization url? and then do an axios call with that code that i exchange then for the actual access token that i can send to my backend?

I tried calling the authorization URL as outlined here : Call Your API Using the Authorization Code Flow

following this example

But i seem to just get this error :

Any input would be greatly appreciated, thanks so much.