Pretty sure I've written the Rule correctly, but am not able to get user_metadata in the user object in my Gatsby SPA

Help
1

Howdy folks, it’s time for my first ask on here. Relatively new React dev here, and am very keen on Auth0 for my auth component. I followed Sam Julien’s excellent guide on implementation and have got it working, for my SPA which I’ve deployed to Netlify. I am NOT able to parse anything from the user object but user.nickname, and I need one or two user_metadata for some functions in the app.

For now I just need a single metadata I’ve put into a user profile:

{
  "chartsite": "lt5"
}

I’ve understood that these metadata can be included in the id token without needing a management token by writing a rule which indicates that. So here’s the rule I’ve put into my Auth0 app:

function (user, context, callback) {
  const namespace = "http://localhost:8000/";
  context.idToken[namespace + 'chartsite'] = user.user_metadata.chartsite;
  return callback(null, user, context);
}

Here’s a component snippet which is returning user.nickname but not user.chartsite on login (note, I am working in localhost:8000 and using development keys, apparently still, but that hasn’t hindered deploying the app to a live development site. Nonetheless I am getting warnings about that.

const Home = ({ user }) => {
  console.log(user.chartsite)
  return (
    <Wrapper2>
      <div class="generic">
        <p>Hi, {user.nickname ? user.nickname : 'friend'}!</p>
        <p>Your site name is {user.chartsite ? user.chartsite : 'unknown'} </p>
      </div>
    </Wrapper2>
  )
}

Last thing I’ve been referencing is this doc: Sample Use Cases: Scopes and Claims

Any enlightening assistance most highly appreciated!

3

Hi @treydonovan,

Welcome to the Auth0 Community!

I understand that you’re unable to retrieve the user_metadata from the Auth0Client.getProfile() method.

First, the getProfile() method calls the Authentication API get user info endpoint, which returns the user profile information from the access token obtained from the /oauth/token endpoint. The user_metadata attribute is not one of the attributes returned in the response. Therefore, you’ll need to use the Rule to append custom claims to the tokens.

In this case, you’ll need to update your Rule with something like the following:

function (user, context, callback) {
 ​const namespace = 'https://myapp.example.com';
 const custom_claim = user.user_metadata.chartsite;

 let idTokenClaims = context.idToken || {};

 idTokenClaims[`${namespace}/chartsite`] = custom_claim;

 context.idToken = idTokenClaims;

 ​return callback(null, user, context);
}

Once that is done, you’ll be able to get your custom claims in the access token when using the getProfile() method.

I hoped this helps!

Please don’t hesitate to reach out if you have any further questions.

Thank you.

4

Hi @rueben.tiow ,
Thanks a lot for that suggestion.
I changed the rule, and updated my call from
user = authResult.idTokenPayload
to:
user = authResult.authTokenPayload

Not so simple. I am using the exact code that is published by Auth0 in this thread:

5

Hi @treydonovan,

Thank you for your reply.

I have made some changes to my initial post and would like to inform you that you should continue appending the custom claims to the ID Token.

I found that our Add user roles to tokens example Rule documentation has an example on how to append custom claims to rules.

After testing this myself, I can confirm that I could append custom claims.

Please let me know how this goes for you.

Thank you.

6

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