{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["admonition","tabs","tab"]},"redocly_category":"Guides","product":"Identity Management","type":"markdown"},"seo":{"title":"Share user accounts across web and mobile apps","description":"Everything about Mosaic Journeys, SDKs, and APIs","siteUrl":"https://developer.transmitsecurity.com"},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"share-user-accounts-across-web-and-mobile-apps","__idx":0},"children":["Share user accounts across web and mobile apps"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Follow the steps below to configure this scenario. The linked guides provide additional field descriptions and implementation details."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Real-life example:"]}," Acme Airlines has a booking website and a mobile app. A traveler who creates an account on the website can sign in to the mobile app with the same email and passkey, and the same authentication methods apply on both. Signing in on the website doesn't sign the traveler in to the mobile app."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Use case:"]}," a web app and a mobile app for the same users. Users use the same account and credentials on web and mobile. Both apps apply the same authentication policies. The mobile app doesn't share a browser session with the web app."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Resulting structure:"]}," one Mosaic application with two clients, one for the web app and one for the mobile app, and shared Mosaic application-level authentication settings. The two clients don't share a browser session."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"img","attributes":{"src":"/assets/use_case_web_mobile_unified.cb798d4996851598b6b5e3bfebf485465e727b7b3a880ffbccb78bf1f752959e.bdd3aebe.svg","alt":"Example: one Acme Airlines Mosaic application holds the shared user pool and authentication policies. It contains two clients: a journey-orchestrated booking website client in an SSO client group, and a backend-based client for the mobile app, which doesn't share a browser session with the website."},"children":[]}]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info","name":"Not this use case?"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/use_cases"},"children":["Choose a setup for your use case"]}," to compare all setups."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"before-you-start","__idx":1},"children":["Before you start"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Choose the login model for each integration:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Web app: journey-orchestrated login through an OIDC or SAML redirect, or backend-based login through Mosaic APIs or SDKs."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Mobile app: journey-orchestrated login through a browser redirect (OIDC, ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Native app"]},"), or backend-based in-app login."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/login_experience"},"children":["Choose your login experience"]},". Have each app's redirect URI (OIDC) or ACS URL and Entity ID (SAML) ready."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"step-1-create-the-mosaic-application","__idx":2},"children":["Step 1: Create the Mosaic application"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In the Admin Portal, go to ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Applications"]}," and create one Mosaic application for both apps. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/create_new_application"},"children":["Create Mosaic applications"]},"."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["All clients in the Mosaic application share its user pool, credentials, and authentication policies. A user who signs up through the web app can sign in to the mobile app with the same account. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/apps_and_clients#mosaic-applications"},"children":["Plan your integration structure"]},"."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Configure the shared authentication methods once, in the Mosaic application's ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Authentication methods"]}," tab. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/auth_methods_customize"},"children":["Customize login methods"]},"."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"step-2-prepare-the-sso-client-groups-and-login-journeys","__idx":3},"children":["Step 2: Prepare the SSO client groups and login journeys"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Skip this step if both clients use backend-based login. If both the web client and the mobile client are journey-orchestrated, create a separate SSO client group for each, so that the mobile app doesn't share a browser session with the web app."]},{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Create the SSO client groups."]}," In ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Applications"]}," > Application > ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Clients"]}," > SSO client groups, select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["+ Add SSO client group"]}," for each journey-orchestrated client, and configure:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["SSO client group name"]},": a name that identifies the group."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Login screens"]},": ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Hosted by Transmit Security"]}," for Mosaic-hosted pages, or ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Self managed (Custom UI)"]}," for a page you host."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Login page URL"]},": for self-managed screens, the address of the page you host. For hosted screens, Mosaic generates the URL; to show users a URL on your own domain, enter a custom login page URL. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/deployment/custom_domains"},"children":["Configure custom domains"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Session timeout"]},": how long the group's session stays valid. Default: 14 days, up to 1 year."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Save the group. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/sso_orchestration/sso_config_service#client-groups"},"children":["Configure SSO"]},"."]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Create the SSO journey."]}," In ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["B2C"]}," or ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["B2B Identity"]}," > ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Journeys"]},", select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Add blank journey"]}," and choose ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["SSO-Journey"]},". Build the login flow with the authentication methods configured in Step 1, then save the journey. You can also reuse an existing SSO journey. The ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Journeys"]}," section of ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/sso_orchestration/sso_config_service#journeys"},"children":["Configure SSO"]}," explains where SSO journeys are created and how clients select them."]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["For a step-by-step example using Mosaic-hosted screens and email OTP, follow ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/orchestration/sso/sso_tutorial"},"children":["Create an SSO journey with the Mosaic-hosted experience"]},". Adapt the journey by adding or replacing steps to match your authentication methods and login requirements."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"step-3-add-the-clients","__idx":4},"children":["Step 3: Add the clients"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Applications"]}," > Application > ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Clients"]},", select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["+ Add client"]}," and choose ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["User authentication client"]},". Add two clients, one for the web app and one for the mobile app. For each client, complete the wizard in the tab that matches its type."]},{"$$mdtype":"Tag","name":"Tabs","attributes":{"size":"medium"},"children":[{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"OIDC web app","disable":false},"children":[{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["General"]},": enter the client name and description."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Authentication flow"]},": leave ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Does your login use OIDC or SAML authentication?"]}," enabled, select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["OIDC"]}," and ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Client type"]}," ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Web app"]},", and enter the web app's ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Redirect URIs"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Login Experience"]},": select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Journey-orchestrated"]},", the client's own SSO client group, and the SSO journey from Step 2. For Mosaic-hosted screens, select a ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Style"]}," or use the default Mosaic style. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/platform/hosted_ui_styles"},"children":["Manage styling for the Mosaic-hosted SSO experience"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Advanced settings"]},": choose the client authentication method and review token lifetimes. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/configure_oidc_client#step-4---advanced-settings"},"children":["OIDC advanced settings"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Client roles"]},": select the roles the client needs to call Mosaic APIs. If you don't select a role, the client implicitly receives the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["App Admin"]}," role. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/manage_client_roles"},"children":["Manage client roles"]},"."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Save the client. Mosaic generates the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["client ID"]}," and the credentials for the selected authentication method; they're available from the client details page. For all fields, see ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/configure_oidc_client"},"children":["Configure an OIDC client"]},"."]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"SAML web app","disable":false},"children":[{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["General"]},": enter the client name and description."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Authentication flow"]},": leave ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Does your login use OIDC or SAML authentication?"]}," enabled, select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["SAML"]},", and enter the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Service provider (SP) ACS URL"]}," and ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Service provider (SP) Entity ID"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Login Experience"]},": select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Journey-orchestrated"]},", the client's own SSO client group, and the SSO journey from Step 2. For Mosaic-hosted screens, select a ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Style"]}," or use the default Mosaic style. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/platform/hosted_ui_styles"},"children":["Manage styling for the Mosaic-hosted SSO experience"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Additional information"]},": select the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["NameID"]}," and review assertion signing, ACS validation, and the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Same Site"]}," cookie policy. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/configure_saml_client#step-4---additional-information"},"children":["SAML additional information"]},"."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["SAML clients have no Client roles step."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Save the client. Mosaic generates the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["SAML SSO URL"]},", ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Transmit Entity ID"]},", ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["X.509 Certificate"]},", and ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["IDP metadata URL"]}," to configure in the app, which acts as the service provider. For all fields, see ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/configure_saml_client"},"children":["Configure a SAML client"]},"."]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"OIDC mobile app","disable":false},"children":[{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["General"]},": enter the client name and description."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Authentication flow"]},": leave ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Does your login use OIDC or SAML authentication?"]}," enabled, select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["OIDC"]}," and ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Client type"]}," ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Native app"]},", and enter the app's ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Redirect URIs"]},". Native app redirect URIs use HTTPS or a reverse-domain custom scheme."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Login Experience"]},": select ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Journey-orchestrated"]},", the client's own SSO client group, and the SSO journey from Step 2. For Mosaic-hosted screens, select a ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Style"]}," or use the default Mosaic style. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/platform/hosted_ui_styles"},"children":["Manage styling for the Mosaic-hosted SSO experience"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Advanced settings"]},": choose the client authentication method and review token lifetimes. Configure ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["PKCE support"]},"; see ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/auth_oidc_pkce#step-2-configure-pkce-settings"},"children":["Configure PKCE settings"]},". See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/configure_oidc_client#step-4---advanced-settings"},"children":["OIDC advanced settings"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Client roles"]},": select the roles the client needs to call Mosaic APIs. If you don't select a role, the client implicitly receives the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["App Admin"]}," role. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/manage_client_roles"},"children":["Manage client roles"]},"."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Save the client. Mosaic generates the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["client ID"]}," and the credentials for the selected authentication method; they're available from the client details page. For all fields, see ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/configure_oidc_client"},"children":["Configure an OIDC client"]},". Keep any client secret in your backend, not in the mobile app."]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"Backend-based","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["For a web app or mobile app that signs users in through Mosaic APIs or SDKs:"]},{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["General"]},": enter the client name and description."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Authentication flow"]},": turn off ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Does your login use OIDC or SAML authentication?"]},". The wizard skips ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Login Experience"]},", so no SSO client group or journey is selected, and the client doesn't join browser SSO."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Advanced settings"]},": choose the client authentication method and review token lifetimes. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/configure_oidc_client#backend-based-authentication"},"children":["Backend-based authentication"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Client roles"]},": select the roles the client needs to call Mosaic APIs. If you don't select a role, the client implicitly receives the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["App Admin"]}," role. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/manage_client_roles"},"children":["Manage client roles"]},"."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Save the client. Mosaic generates the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["client ID"]}," and the credentials for the selected authentication method; they're available from the client details page."]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["If both clients are journey-orchestrated, select a different SSO client group for each, so that the mobile app doesn't share a browser session with the web app."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"step-4-integrate-each-app","__idx":5},"children":["Step 4: Integrate each app"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Integrate each app with its own client, using the tab that matches its type."]},{"$$mdtype":"Tag","name":"Tabs","attributes":{"size":"medium"},"children":[{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"OIDC web app","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Send an authorization request with the client ID and redirect URI, exchange the returned code for user tokens from your backend, and validate the tokens before creating the app's local session. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/sso_orchestration/sso_quickstart_hosted_ui_oidc"},"children":["Launch OIDC SSO with the Mosaic-hosted experience"]}," and ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/validate_tokens"},"children":["Validate tokens"]},"."]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"SAML web app","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Redirect users to the client's ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["SAML SSO URL"]},", then verify the SAML response and assertion at the ACS URL before creating the app's local session. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/sso_orchestration/sso_quickstart_hosted_ui_saml"},"children":["Launch SAML SSO with the Mosaic-hosted experience"]},"."]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"OIDC mobile app","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Open the authorization request in the device browser and handle the redirect back to the app. Exchange the code for tokens using PKCE; keep any client secret in your backend. Then validate the tokens. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/auth_oidc_pkce"},"children":["Secure login with PKCE"]}," and ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/validate_tokens"},"children":["Validate tokens"]},"."]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"Backend-based","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["From your backend, get a client access token and call the backend authentication APIs for the login methods you offer, then validate the returned tokens. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/retrieve_client_tokens"},"children":["Get client access tokens"]}," and ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/auth_overview"},"children":["Backend authentication"]},"."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Email OTP, SMS OTP, and passwords need only these API calls. Passkeys and biometrics also need a Mosaic SDK on the device: the Platform SDK for WebAuthn in a web app (see ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/webauthn/quick_start_sdk"},"children":["WebAuthn quick start: Web SDK"]},"), and the Authentication SDK for mobile biometrics (see ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/be_auth_biometrics_android"},"children":["Android"]}," and ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/be_auth_biometrics_ios"},"children":["iOS"]},")."]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["If an SSO client group uses ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Self managed (Custom UI)"]},", build the login page with the Mosaic Platform SDK, which runs the SSO journey, and host it at the group's ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Login page URL"]},". See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/sso_orchestration/sso_quickstart_selfhosted_ui"},"children":["Build your SSO page"]},"."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Implement session renewal and logout for each integration. Follow ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/sso_orchestration/sso_logout_api"},"children":["SSO session logout"]}," for browser SSO and ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/be_manage_sessions"},"children":["Manage backend sessions"]}," for backend-based login."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"check-the-result","__idx":6},"children":["Check the result"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["To test login, use a user who belongs to this Mosaic application. Create one from ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Users"]}," > ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["+ Add Users"]},", enter an email address, and select this Mosaic application. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/user/manage_users#create-edit-or-delete-users"},"children":["Manage users"]},". A login method based on email OTP can sign this user in; for passwords or passkeys, the user must register the credential first."]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["A user created through one client can sign in through the other client with the same credentials."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Changes to the Mosaic application's authentication methods apply to all clients."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Signing in on the web app doesn't sign the user in to the mobile app, and the reverse."]}]}]},"headings":[{"value":"Share user accounts across web and mobile apps","id":"share-user-accounts-across-web-and-mobile-apps","depth":1},{"value":"Before you start","id":"before-you-start","depth":2},{"value":"Step 1: Create the Mosaic application","id":"step-1-create-the-mosaic-application","depth":2},{"value":"Step 2: Prepare the SSO client groups and login journeys","id":"step-2-prepare-the-sso-client-groups-and-login-journeys","depth":2},{"value":"Step 3: Add the clients","id":"step-3-add-the-clients","depth":2},{"value":"Step 4: Integrate each app","id":"step-4-integrate-each-app","depth":2},{"value":"Check the result","id":"check-the-result","depth":2}],"frontmatter":{"title":"Shared accounts across web and mobile","seo":{"title":"Share user accounts across web and mobile apps"}},"lastModified":"2026-10-15T11:23:16.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/guides/user/use_case_web_mobile_unified","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}