SSR Support for Angular Universal

CharlieGreenman commented 5 months ago

Checklist

[X] I have looked into the Readme, Examples, and FAQ and have not found a suitable solution or answer.
[X] I have looked into the API documentation and have not found a suitable solution or answer.
[X] I have searched the issues and have not found a suitable solution or answer.
[X] I have searched the Auth0 Community forums and have not found a suitable solution or answer.
[X] I agree to the terms within the Auth0 Code of Conduct.

Describe the problem you'd like to have solved

Currently, i import auth0 angular only in the client-side module and leave it out of the SSR module.

This causes the public page to load first, and then the authenticated page.

If auth0/angular had an out of box solution with Angular Universal, that would be a game changer. Load times would be almost instantaneous

Describe the ideal solution

Find some unique way of having auth0/angular work with Angular Universal.

Alternatives and current workarounds

None at the moment. Right now public page loads first, and then the authenticated page

Additional context

The user story around Angular SSR is getting better (e.g. now has hydration and under Angular's wing/open source repo). The timing might be right to now look into this. Thank you

No response

frederikprijck commented 5 months ago

Thanks. Our SDK, including the SDK used under the hood, relies on the window object, local storage, postMessage API , iframes, etc, so there isn't much we can change to make this work on the server.

In order to make it work with Universal, see https://github.com/auth0/auth0-angular/blob/main/FAQ.md#7-using-the-sdk-with-angular-universal, which comes down to what you are doing. The fact that angular now comes with SSR built in rather than using Universal doesnt change much on this end.

Given this is a client side SDK, the above should allow you to integrate it pretty well as that's how you include a library that relies heavily on browser APIs.

frederikprijck commented 5 months ago

One thing we could do, is provide a Auth0ServerModule/ provideAuth0OnTheServer, to make using our SDK with SSR easier. However, that would still end up using exactly the same as mentioned in our FAQ, just in a way that the user doesnt have to do this themselves. Downside is that it may look as if we have full SSR support, while all we do is mock away all the services on the server.

To avoid this confusion, we havent added this yet. With the ease of using SSR these days, i can see this come up more often and we can always reconsider based on the demand.

CharlieGreenman commented 5 months ago

Right. I think it is already time to re-consider based on the demand if auth0 has some extra time. Nextjs is ssr with auth0 for instance. Would be nice to do the same with Angular. I would be a happier customer, do with that what you will

auth0 / auth0-angular