Is there a way to persist authentication between different applications that are hosted on different domains and may also be embedded within another website?
For example, suppose I have the following domains (all using the same Auth0 tenant):
- https://will-be-embedded.com (can be accessed directly or embedded into other websites)
- https://host1.com
- https://another-host2.com
I would like a user to log in on one of these sites and automatically be logged in on the others as well. For instance, if a user logs in on will-be-embedded.com, they should also be authenticated when they visit host1.com or another-host2.com.
I am particularly interested in persisting authentication in a micro-frontend architecture, where one website is embedded within another. For example, if a user is on host1.com and logs in through will-be-embedded.com (which is embedded within host1.com), they should be authenticated across the entire website, not just within the embedded component. Currently, I am experiencing issues with this scenario.
On my dummy test websites based on this Auth0 React sample, it seems to work. However, when I try to implement it with real websites, it does not work as expected.
Does anyone have any ideas or recommendations on how to implement this kind of functionality?