How to set and get the user meta data with custom login flow

Help
,
1

i have setup the auth0 account and integrated with my react application.
under the Branding → Universal Login → Login , i have customized the js code to accept additional field as an input and pass the same with user_metadata property,
finally i have used pre user registeration flow and added below handler to add additional metadata,
api.user.setUserMetadata("myCustomField", myCustomValue);
with this above approach, the additional metadata is getting reflected in the users section.
but how can i access this metadata information from my react application.

2

Hey @azamp3139 :wave:

You can create a new Post-Login Auth0 Action to add the user_metadata properties to custom claims in the tokens, which can then be access in your React frontend - check out the example in this link on how to set custom claims for a user.

3

hi @gparascandolo , thanks for the support,
in the custom login flow, im able to add the user metadata with post user registration flow, and the same is reflected in users section with the additional data,
but when i tried to append these custom metadata post login flow using custom claims, the same is not reflected in the frontend.
im using this below handler to pass the custom claims.

const namespace = 'https://dev-xyzxyz.us.auth0.com/'; 
if (event.user.user_metadata && event.user.user_metadata.fullname) {
api.idToken.setCustomClaim(`${namespace}myCustomField`, event.user.user_metadata.myCustomField);
}

also , please check whether the namespace pattern is correct and whether we can pass custom claims with free auth0 instance.

4

@azamp3139 Unfortunately, Auth0 domains cannot be used as namespace identifiers as outlined under the " Namespaced guidelines" in this documentation link - Create Custom Claims

Is there another domain you own that can be used for the custom claims namespace?

If not and this is absolutely necessary for your application, Auth0 does allow non-namespaced custom claims.
But please be sure to read the “Non-namespaced guidelines” and “General restrictions” sections in the documentation link above.