I have a small (React) microsite that I want to embed in mulitple apps including:
The native apps will either use WebView or in-app-browser-tab, while the web app & Salesforce (Canvas) will use iframes.
The microsite will call a back-end API layer where operations are protected by OAuth 2.0.
Customers using the public clients apps (iOS/Android/web) authenticate to Auth0, while staff using Salesforce authenticate directly into Salesforce.
I know how to make the back-end API trust multiple IDPs/issuers i.e. Auth0 & Salesforce, but how do I implement a SSO flow to pass the authenticated user context (e.g. their access tokens) to the microsite from the public client apps & Salesforce?
SSO can be achieved using auth/session cookies e.g.
(assuming use of Open ID Connect) after the user navigates to the /authorize endpoint and authenticates, the authorization server can set a cookie on the HTTP response. If the native app subsequently opens a web-view to a microsite that authenticates against the same IDP tenant, the auth/session cookie can be passed through on the /authorize request, which should be detect by the IDP and the user should be transparently authenticated.
In the the Salesforce scenario, staff are authenticated in Salesforce. When a microsite is opened inside of Salesforce (e.g. using Salesforce Canvas) that authenticates to an external IDP (e.g Auth0 in my case), we can transparently federate through to Salesforce (e.g. in Auth0 by appending &connection=sf to the /authorize request, where sf is the name of an SAML-based enterprise connection). The microsite would automatically redirect to the Salesforce authentication page, but Salesforce would detect the (Salesforce) auth/session cookie and transparently authenticate the user.