skip to content
Alvin Lucillo

Extra audience in access token payload

/ 1 min read

Yesterday, with a specified audience, the access token became readable. If we read it with jwt.io, you will notice that there are two audiences.

export const appConfig: ApplicationConfig = {
	providers: [
		provideBrowserGlobalErrorListeners(),
		provideRouter(routes),
		provideAuth0({
			domain: "dev-redacted.us.auth0.com",
			clientId: "redacted",
			authorizationParams: {
				redirect_uri: window.location.origin,
				audience: "http://localhost:8080",
			},
		}),
	],
};

In the example access token payload below, the first audience is the custom API, and the second is for /userinfo access. The latter is important because the token can also be used to call /userinfo to get profile claims that identify an authenticated user. Notice that the scope in the token are the same scopes requested by the Auth0 Angular SDK to auth0 server in the /authorize call (note that scopes in the access token may be different from the requested on auth0 guardrails like RBAC). It’s important to note that the same access token can be used by either resource servers, but there must be some validations to check the claim and validity of the token on the server side.

{
	"iss": "https://dev-redacted.us.auth0.com/",
	"sub": "auth0|redacted",
	"aud": ["http://localhost:8080", "https://dev-redacted.us.auth0.com/userinfo"],
	"iat": 1780749223,
	"exp": 1780835623,
	"scope": "openid profile email",
	"azp": "redacted"
}