angularauth0

Auth0 interceptor not attaching token for standalone Angular


Angular v19, configuration:

export const appConfig: ApplicationConfig = {
  providers: [
    provideZoneChangeDetection({ eventCoalescing: true }),
    provideRouter(routes),
    provideAnimationsAsync(),
    provideAuth0({
      domain: 'xxx',
      clientId: 'yyy',
      authorizationParams: {
        audience: 'aaa',
        redirect_uri: window.location.origin,
      },
    }),
    provideHttpClient(
      withInterceptors([authHttpInterceptorFn])
    )
  ]
};

Simple calling:

this.auth.isAuthenticated$.subscribe((isAuthenticated) => {
  if (isAuthenticated) {
    this.http.get('/api/v1/tests').subscribe((data) => {
      console.log(data);
    });
  }
});

Token is never attached to Authorization header. When I try to get token by auth.getAccessTokenSilently() it works and I get the token.

I could probably build my own interceptor but I would like to use the one made by Auth0.


Solution

  • export const appConfig: ApplicationConfig = {
      providers: [
        provideZoneChangeDetection({ eventCoalescing: true }),
        provideRouter(routes),
        provideAnimationsAsync(),
        provideAuth0({
          domain: 'xxx',
          clientId: 'yyy',
          authorizationParams: {
            audience: 'aaa',
            redirect_uri: window.location.origin,
          },
          httpInterceptor: {
            allowedList: [
              '/api/*'
            ],
          }
        }),
        provideHttpClient(
          withInterceptors([authHttpInterceptorFn])
        )
      ]
    };
    

    Solved. You have to provide two things: