Log in works but spits a invalid JWT?

After “loginWithRedirect” in React i get the access token using getAccessTokenSilently but it does not return a valid JWT

Here we injected the Auth0Provider into the app

import React from "react"
import { useNavigate } from "react-router-dom"
import { Auth0Provider } from "@auth0/auth0-react"

const Auth0ProviderWithHistory = ({ children }) => {
    const domain = process.env.REACT_APP_AUTH0_DOMAIN
    const clientId = process.env.REACT_APP_AUTH0_CLIENT_ID
    const audience = process.env.REACT_APP_AUTH0_AUDIENCE

    const navigate = useNavigate()

    const onRedirectCallback = appState => {
        navigate(appState?.returnTo || window.location.pathname)

    return (
                audience: audience,

export default Auth0ProviderWithHistory

Just a button that when you click you’ll get redirected to the login page

import React from "react"
import { useAuth0 } from "@auth0/auth0-react"
import { FiLogIn } from "react-icons/fi"

const LoginButton = () => {
    const { loginWithRedirect } = useAuth0()

    return (
        <div className="user-bar">
            <FiLogIn />
            <div onClick={() => loginWithRedirect()}>Log In</div>

export default LoginButton

followed this doc Auth0 React SDK Quickstarts: Call an API
if we call the getAccessTokenSilently with 0 parameters it does not change the output

import React, { useEffect } from "react"
import { useAuth0 } from "@auth0/auth0-react"
import { FiLogOut } from "react-icons/fi"
import Cookies from "js-cookie"

const LogoutButton = () => {
    const { logout, user, getAccessTokenSilently } = useAuth0()

    useEffect(() => {
        const getUserMetadata = async () => {

            try {
                const accessToken = await getAccessTokenSilently({
                    authorizationParams: {
                        audience: process.env.REACT_APP_AUTH0_AUDIENCE,
                        scope: "read:current_user",
                Cookies.set("jwt", accessToken) // Use the access token to authenticate with your backend
            } catch (e) {

    }, [getAccessTokenSilently, user])

    const handle_logout = () => {
            returnTo: window.location.origin,

    return (
        <div className="user-bar">
            <FiLogOut />
            <div onClick={handle_logout}>Log Out</div>

export default LogoutButton

for reference, this is the JWT


Hi @fyll,

Welcome to the Auth0 Community!

That appears to be an encrypted token. To get a JWT, you need to pass a valid audience param.

More here: Why is my access token not a JWT? (Opaque Token)

What version of @auth0/auth0-react are you using?

I had a similiar issue earlier this week where I got an error message saying “invalid compact JWS”. I was trying to access a protected api endpoint using an JWS obtained from the getAccessTokenSilently() method in the client.

I found that the error disappeared when downgrading @auth0/auth0-react from the latest 2.0.1 to 1.10.1.

I’ve made a repo demonstrating the issue here: auth0-sandbox

Please download yourself and see if this works for you. Use package.json to switch between auth0-react versions.

Hope it helps!

Hi @paloskar,

Thanks for the suggestion.

Before downgrading, I would suggest requesting a JWT by following the link I provided above.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.