Make Request to Auth0 api from react native app

[schoenbl]

I have a react native app authenticated with Auth0.

I have an API that uses react native.

When a user signs in, i take the accessToken that is given for that user, and I make request to the API with the accessToken set as the authorization header.

I do so like this:

const requestHeader = {
        headers: {
            Authorization: `Bearer ${accessToken}`,
        }
    }

axios.post(API_BASE + '/api/example/', requestHeader)

The accessToken is something short like this: aBQdd0kOvb1pNj-9XDj_C6bKWkMg9D_q

When I try to validate the request with the API, I get this error:

UnauthorizedError: jwt malformed

I know i’m getting this error because the access token isn’t a JWT.

I’m validating in the API like this:

exports.checkJwt = jwt({
    secret: jwksRsa.expressJwtSecret({
        cache: true,
        rateLimit: true,
        jwksRequestsPerMinute: 5,
        jwksUri: 'https://dev-0p1doq9r.auth0.com/.well-known/jwks.json'
  }),
  audience: 'ddasdsfasdfasd',
  issuer: 'safsdfasdfasdfafsdf',
  algorithms: ['RS256']
});

I know that accessToken needs to be transformed into a JWT on the client, BUT HOW? I have not found any documentation for this; I have also not found what other properties need to be included in the JWT for validation.

[dan.woda]

Hi @schoenbl,

Welcome back to the Auth0 Community!

Take a look at this resource:

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

Question: Why is my access token not a JWT? (Opaque Token) Answer: An access token will be issued in one of the following formats: JSON Web Token (JWT) : Tokens that conform to the JSON Web Token standard and contain information about an entity in the form of claims. They are self-contained in that it is not necessary for the recipient to call a server to validate the token. Access Tokens issued for the Auth0 Management API and Access Tokens issued for any custom API that you have registere…

[schoenbl]

Hi Dan! Thanks for your response! That doesn’t seem to be working for me.

This is how I’m using the Auht0 constructor from the React Native Auth0 SDK:

import Auth0 from 'react-native-auth0';
const auth0 = new Auth0({
    audience: "https://api.thepodapp.com",
    domain: 'dev-0p1doq9r.auth0.com',
    clientId: 'LOfg18i9rCofQQadginNQVlDz8zF7PXI',
});

export const signInAsync = (callback) => {
    auth0
        .webAuth
        .authorize({scope: 'openid profile email'})
        .then(credentials => callback(credentials))
        .catch(err =>  callback(null, err))
}

When I do that, I still receive and opaque token. Should I be receiving a JWT when I do this?

[dan.woda]

Have you registered an API in the Auth0 dashboard that corresponds with that audience?

E.G.:

[schoenbl]

Hi Dan, thanks for the response. I really appreciate your help.

Yes, I have made the corresponding API in the Auth0 dashboard:

Any other ideas on what the issue might be?

[dan.woda]

Can you try passing the audience param to your authorize method?

authorize( {
  ...,
  audience:"https://test-api"
} )

[schoenbl]

This worked! Thank you! Should the documentation be updated?

[dan.woda]

It sounds like that would be helpful. I can’t find any references to passing the audience when you create the Auth0 object, did you see that recommended somewhere? I’d like to recommend an update.