Problem with Auth0 Single Page App login in Angular 2 and redirect

Hi,

We have product for which we’re using Auth0’s free version: a NestJS (latest version) application with an Angular 2 (latest version) frontend. This is where we’re having trouble.

We’re using Auth0’s Angular service (from the Guide) with minor changes to the handleAuthCallback() function to search for the user by way of the Auth0 identifier.

// Subscribe to authentication completion observable.
// Response will be an array of user and login status.
authComplete$.subscribe(([user, loggedIn]) => {
    if (loggedIn) {
        // Search for the user in the API by Auth0 id.
        this.userService.getById(user.sub).subscribe(user => {
            // @ts-ignore
            if (user !== undefined) {
                // record the user received from the API request
                // @ts-ignore
                this.apiUser = user;
                // Redirect to target route after callback processing
                this.router.navigate([targetRoute]);
            }
        });
    }
});

Before an update, users were able to log in. But at some point, probably after an update, the Auth0 integration stopped functioning.

Postman can establish a call with the server using Auth0’s Machine-to-Machine credentials. But the Angular frontend throws a 403 error using the Single Page Application credentials. Grant rights are checked, and custom properties are also set in the application/API. Postman also can’t connect to the Single Page App using its credentials.

/*
Environment credentials points on the Single Page App, 
not the Machine-to-machine credentials.
*/
private auth0Client$ = (from(
    createAuth0Client({
        client_id   : environment.auth0.clientId,
        domain      : environment.auth0.domain,
        audience    : environment.auth0.audience,
        redirect_uri: environment.auth0.redirectUri
    })
) as Observable<Auth0Client>).pipe(
    shareReplay(1), // Every subscription receives the same shared value
    catchError((err: any) => throwError(err))
);

There’s a secondary problem when we set the callback URL (for example, as /callback ) with the IVY mode (hashtag in the URL) enabled: a redirect loop is created between the homepage (/) and the callback (/callback). Several threads in the forum suggest that people are having similar problems. Must the callback URL be blank? I’m not sure.

In any event, we’re stuck. Any thoughts would be greatly appreciated! Thanks.