diff --git a/docs/docs/recipes/logto-as-idp/README.mdx b/docs/docs/recipes/logto-as-idp/README.mdx index 7dba57db8ff..48a78204510 100644 --- a/docs/docs/recipes/logto-as-idp/README.mdx +++ b/docs/docs/recipes/logto-as-idp/README.mdx @@ -87,5 +87,6 @@ All third-party applications will be catalogued on the **Applications** page, sp ## Continue with - [branding customization](./branding-customization) +- [third-party app configuration](./configure-3rd-party-app-in-console) - [permission management](./permissions-management) - [application reference](../../references/applications/) diff --git a/docs/docs/recipes/logto-as-idp/configure-3rd-party-app-in-console.mdx b/docs/docs/recipes/logto-as-idp/configure-3rd-party-app-in-console.mdx index 5082719697d..d56d2cb3255 100644 --- a/docs/docs/recipes/logto-as-idp/configure-3rd-party-app-in-console.mdx +++ b/docs/docs/recipes/logto-as-idp/configure-3rd-party-app-in-console.mdx @@ -1,54 +1,5 @@ -import ClientCredentials from './assets/client-credentials.webp'; -import DiscoveryEndpoint from './assets/discovery-endpoint.webp'; -import EndpointDetails from './assets/endpoint-details.webp'; -import RedirectUri from './assets/redirect-uri.webp'; +import Content from './fragments/_configure-3rd-party-app.mdx'; -## Create an third-party OIDC application in Logto +# Create an third-party OIDC application in Console -Just like how you create a first-party application in Logto, you can also create an application for third-party services that support OIDC. This application will act as an IdP for your third-party applications. - -1. Go to the **Logto Console** and navigate to the **Applications** page. - -2. Select "Third-party app -> OIDC" as the application type. - - If this is the first time you create an application, click on the **View all** link to see all application types. - ![application list](./assets/application-list.webp) - - Otherwise, click on the **Create application** button on the top right corner of the page and select "Third-party app -> OIDC" as the application type. - ![create application](./assets/create-application.webp) - -3. Just like creating a Logto first-party application, enter a **name** and **description** for your application and click on the **Create** button. A new third-party OIDC application will be created. - - ![application details](./assets/application-details.webp) - -## Setup the OIDC configurations - -In order to set up Logto as an IdP for your third-party applications, you need to configure the OIDC settings under the application details page. - -1. Provide the **redirect URI** of your third-party application. This is the URL that the third-party application will redirect users to after they are authenticated by Logto. You can usually find this information in the third-party application's IdP connection settings page. - - :::note - Logto supports multiple redirect URIs. You can add more redirect URIs by clicking on the **Add another** button. - ::: - - redirect uri - -2. Retrieve the **client ID** and **client secret** from Logto application details page and enter them into your service provider's IdP connection settings page. - - client credentials - -3. Retrieve the **authorization endpoint** and **token endpoint** from Logto application details page and provide them to your service provider. - - If your service provider supports OIDC discovery, you can simply copy the **discovery endpoint** from Logto application details page and provide it to your service provider. The service provider will be able to retrieve all the up to date OIDC authentication information from the discovery endpoint automatically. - - discovery endpoint - - Otherwise, click on the **Show endpoint details** button to view all the OIDC authentication endpoints. - - endpoint details - -## Manage your third-party applications - -All third-party applications will be catalogued on the **Applications** page, specifically under the **Third-party apps** tab. This arrangement distinguishes them from first-party applications for you, ensuring easy management. - -![third-party apps](./assets/third-party-apps.webp) + diff --git a/docs/docs/recipes/logto-as-idp/fragments/_configure-3rd-party-app.mdx b/docs/docs/recipes/logto-as-idp/fragments/_configure-3rd-party-app.mdx new file mode 100644 index 00000000000..530e302dbb7 --- /dev/null +++ b/docs/docs/recipes/logto-as-idp/fragments/_configure-3rd-party-app.mdx @@ -0,0 +1,53 @@ +{/* This is a re-usable fragment that currently being referenced by both the recipe and the connector guide */} +import ClientCredentials from '../assets/client-credentials.webp'; +import DiscoveryEndpoint from '../assets/discovery-endpoint.webp'; +import EndpointDetails from '../assets/endpoint-details.webp'; +import RedirectUri from '../assets/redirect-uri.webp'; + +Just like how you create a first-party application in Logto, you can also create an application for third-party services that support OIDC. This application will act as an IdP for your third-party applications. + +1. Go to the **Logto Console** and navigate to the **Applications** page. + +2. Select "Third-party app -> OIDC" as the application type. + + If this is the first time you create an application, click on the **View all** link to see all application types. + ![application list](../assets/application-list.webp) + + Otherwise, click on the **Create application** button on the top right corner of the page and select "Third-party app -> OIDC" as the application type. + ![create application](../assets/create-application.webp) + +3. Just like creating a Logto first-party application, enter a **name** and **description** for your application and click on the **Create** button. A new third-party OIDC application will be created. + + ![application details](../assets/application-details.webp) + +## Setup the OIDC configurations + +In order to set up Logto as an IdP for your third-party applications, you need to configure the OIDC settings under the application details page. + +1. Provide the **redirect URI** of your third-party application. This is the URL that the third-party application will redirect users to after they are authenticated by Logto. You can usually find this information in the third-party application's IdP connection settings page. + + :::note + Logto supports multiple redirect URIs. You can add more redirect URIs by clicking on the **Add another** button. + ::: + + redirect uri + +2. Retrieve the **client ID** and **client secret** from Logto application details page and enter them into your service provider's IdP connection settings page. + + client credentials + +3. Retrieve the **authorization endpoint** and **token endpoint** from Logto application details page and provide them to your service provider. + + If your service provider supports OIDC discovery, you can simply copy the **discovery endpoint** from Logto application details page and provide it to your service provider. The service provider will be able to retrieve all the up to date OIDC authentication information from the discovery endpoint automatically. + + discovery endpoint + + Otherwise, click on the **Show endpoint details** button to view all the OIDC authentication endpoints. + + endpoint details + +## Manage your third-party applications + +All third-party applications will be catalogued on the **Applications** page, specifically under the **Third-party apps** tab. This arrangement distinguishes them from first-party applications for you, ensuring easy management. + +![third-party apps](../assets/third-party-apps.webp) diff --git a/docs/integrations/third-party/oidc/README.mdx b/docs/integrations/third-party/oidc/README.mdx index b262a7163df..ad648eced92 100644 --- a/docs/integrations/third-party/oidc/README.mdx +++ b/docs/integrations/third-party/oidc/README.mdx @@ -6,8 +6,10 @@ sidebar_custom_props: logoFilename: 'oidc.svg' --- -import Content from '../../../docs/recipes/logto-as-idp/configure-3rd-party-app-in-console.mdx'; +import Content from '../../../docs/recipes/logto-as-idp/fragments/_configure-3rd-party-app.mdx'; # Logto as an Identity Provider (IdP) +## Create an third-party OIDC application in Logto +