Auth0 Home Blog Docs

Invalid access token - ionic 2+ SDK quickstart

quickstart
access-token
mobile
api-authorization
ionic2

#1

I’ve spent a few days down this rabbit hole and I’m hoping someone here can help. I’m creating a mobile app based on the Auth0 Ionic 2+ SDK Quickstart. The login and redirect works great, and I retrieve a valid idToken. However, the access token I need to authenticate with my API does not appear to be valid. I already have an angular 4 front-end that successfully authenticates with my express backend; the problem here is that I’m not getting valid access tokens in my ionic app.

example access token: IdCKy7eYbl0pwxtE

Above is an example accessToken that I get back in the ionic app, and when I send this to my API as an authorization header I get: UnauthorizedError: jwt malformed. This looks to me like a refresh token, but when I send a post request to: https://findbl0k.auth0.com/oauth/token with the following payload it says my refresh token is invalid.

request:
{ 
    "grant_type": "refresh_token",
    "client_id": "yecF47olgqyu0GadqfIRBDcB8JWufsg-",
    "refresh_token": "IdCKy7eYbl0pwxtE"
}
response: 
{
    "error": "invalid_grant",
    "error_description": "Unknown or invalid refresh token."
}

here’s my config in auth.services.ts:

const auth0Config = {

  // needed for auth0
  clientID: 'yecF47olgqyu0GadqfIRBDcB8JWufsg-',
  audience: 'https://findbl0k.auth0.com/api/example',

  // needed for auth0cordova
  clientId: 'yecF47olgqyu0GadqfIRBDcB8JWufsg-',
  domain: 'findbl0k.auth0.com',
  callbackURL: location.href,
  packageIdentifier: 'io.ionic.starter.auth0',
  scope: 'openid profile read:messages'
};

I’m not sure why this access token is invalid. Any help here is greatly appreciated.


#2

Hi guys,

I figured this out. I’ll post the answer here for anyone googling how to access a secured auth0 API from Ionic 2+. I set the audience parameter in the auth0config object, but I needed to set the audience for auth0cordova. On line 57 of the src/services/auth.service.ts you have to edit the options object in the public login function to include the correct audience and scope.

public login() {
    const client = new Auth0Cordova(auth0Config);

    const options = {
      scope: 'openid profile offline_access'
    };

    ...

add the audience parameter like this:

const options = {
      scope: 'openid profile read:messages',
      audience: 'https://findbl0k.auth0.com/api/example',
    };

Hopefully this helps someone who was struggling like me.


#3