#How to show a login modal on protected routes without blocking navigation?

1 messages · Page 1 of 1 (latest)

muted surge
#

I have a group of routes protected by authentication. What I’d like is a bit different from the usual “redirect to login” flow:

When a non-authenticated user tries to access a protected route, I want the page to render normally in the background, but also open a login modal on top.

After the user logs in, the modal closes and they should remain on the same page they originally wanted to visit.

The problem is that some components behind the modal will immediately trigger their HTTP requests. Since there is no JWT yet, these requests fail with 401 Unauthorized.

What would be the best pattern to handle this in Angular?

Should the guard allow the navigation and just open the modal?

How can I catch those 401 responses without breaking the UI? (e.g. use an HttpInterceptor to suppress/retry requests once the user logs in)

Is there a clean way to “re-run” the data fetching automatically after the login succeeds?

#

How to show a login modal on protected routes without blocking navigation?