I am trying to read the access token in my Angular app. I know that the access token is designed to be sent to the api, and I am already consuming it in my api properly. The problem is, we want to show/hide parts of our application on the client-side based on claims in the access token (i.e. don’t allow someone to edit a widget on the client-side if they don’t have edit:widget permission). I have RBAC enabled already, and my access tokens already have permissions in them.
When I was searching around, it appeared like there wasn’t an easy way to read the value from access token using the sdk, and Auth0 recommends embedding claims in the identity token. I could easily make a rule to embed the permissions in the identity token also, but that doesn’t seem like the right approach (seems like I would be embedding authorization in the identity token). What is the recommended approach? Is there something in the auth0 sdk that gives me access to the claims/permissions in the access token, or should I implement another library to read the access token?
I know that we previously recommended using this approach with some of our older Angular implementations. Let me reach out to the SDK team to see if there is any way to use this same strategy with the current SDK.
The Angular SDK uses the SPA-JS SDK which does not expose the scopes from the /token response as being used in that blog post. This behavior is identical in our React SDK as well. The reasoning here is that an Access Token is supposed to be used by an API only, and not the application. So I would think the same goes for the scopes, which are actually related to the Access Token and have less meaning in the client.
Thanks Dan,
While I do agree that the backend (resource servers) should be using the access token to perform authorization (because data from the internet should not be trusted and client-side controls are all about usability, not security), I do not agree that authorization is only the domain of the backend. Why would I, for example, show a link to an administrator page in my menu, if the user does not have any admin permissions? Similarly, I would like to control the presentation of my objects based on what the user can do (i.e. open a page with form-fields for editing vs displaying the text in a read-only context). Is there any security concerns to inspecting the access token clientside that I am not considering?
I ended up using jwt_decode to read the access token after the user completes authentication so I have access to the granular permissions that the customer has. I am happy to share my solution if that would be helpful.
I think it would be best to engage directly with the owners of the SDK, which you can do in the GitHub repo issue I linked. It looks like this is a discussion that is already happening there. Thanks for your detailed input!