docs: add linkedin guide (#7600)

* docs: add linkedin guide

* docs: change pictures and settings
This commit is contained in:
Fabi 2024-03-25 17:34:49 +01:00 committed by GitHub
parent 376c3a3fff
commit 62652f4f91
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
10 changed files with 96 additions and 2 deletions

View File

@ -5,7 +5,7 @@ Organization: Choose the organization in the menu and go to $YOUR-DOMAIN/ui/cons
1. Go to the Settings
2. Modify your login policy in the menu "Login Behavior and Security"
3. Enable the attribute "External IDP allowed"
3. Enable the attribute "External Login allowed"
You can also change the settings through the API directly either in the default settings or on a specific organization:
- [Update Default Login Settings](/docs/apis/resources/admin/admin-service-update-login-policy)

View File

@ -0,0 +1,12 @@
The Generic OAuth Provider allows you to configure any OAuth compliant identity providers.
The following information you need to fill out by yourself:
<li><b>Name</b> {props.name}</li>
<li><b>Authorization Endpoint</b> {props.authendpoint}</li>
<li><b>Token Endpoint</b> {props.tokenendpoint}</li>
<li><b>User Endpoint</b> {props.userendpoint}</li>
<li><b>ID Attribute</b> {props.id}</li>
<li><b>Client-ID</b> {props.clientid}</li>
<li><b>Client-Secret</b> {props.clientid}</li>
<li><b>Scopes</b>: (openid, profile, email is preconfigured)</li>

View File

@ -0,0 +1,81 @@
---
title: Configure LinkedIn as an OAuth Identity Provider in ZITADEL
sidebar_label: LinkedIn generic OIDC
id: linkedin-oauth
---
import GeneralConfigDescription from './_general_config_description.mdx';
import Intro from './_intro.mdx';
import CustomLoginPolicy from './_custom_login_policy.mdx';
import IDPsOverview from './_idps_overview.mdx';
import GenericOAuth from './_generic_oauth.mdx';
import Activate from './_activate.mdx';
import PrefillAction from './_prefill_action.mdx';
import TestSetup from './_test_setup.mdx';
<Intro provider="LinkedIn"/>
## LinkedIn Configuration
### Register a new client
1. Go to the LinkedIn Developer console and create a new App: https://www.linkedin.com/developers/apps/new
2. Add your App Name, your Company Page and a Logo
3. Add "Sign In with LinkedIn using OpenID Connect" by clicking "Request access"
4. Go to the Auth Settings of the App and add the following URL to the "Authorized redirect URLs"
- {your-domain}/ui/login/login/externalidp/callback
- Example redirect url for the domain `https://acme.zitadel.cloud` would look like this: `https://acme.zitadel.cloud/ui/login/login/externalidp/callback`
5. Verify the app as your company
6. In the Auth - OAuth 2.0 scopes section you should see `openid`, `profile` and `email` listed
7. Save Client ID and Primary Client Secret from the Application credentials
![Add new Application in LinkedIn](/img/guides/linkedin_add_app.png)
## ZITADEL Configuration
### Add custom login policy
<CustomLoginPolicy/>
### Go to the IdP Providers Overview
<IDPsOverview templates="Generic OAuth"/>
### Create a new Generic OAuth Provider
<GenericOAuth
name=": e.g. LinkedIn"
authendpoint="https://www.linkedin.com/oauth/v2/authorization"
tokenendpoint="https://www.linkedin.com/oauth/v2/accessToken"
userendpoint="https://api.linkedin.com/v2/userinfo"
id="sub"
clientid=": Client id from the application previously created in your LinkedIn account"
clientsecret=": Client Secret from the application previously created in your LinkedIn account"
/>
<GeneralConfigDescription provider_account="LinkedIn account" />
![LinkedIn Provider](/img/guides/zitadel_linkedin_create_provider.png)
### Activate IdP
<Activate/>
![Activate the LinkedIn Provider](/img/guides/zitadel_activate_linkedin.png)
## Test the setup
<TestSetup loginscreen="your LinkedIn login"/>
![LinkedIn Button](/img/guides/zitadel_login_linkedin.png)
![LinkedIn Login](/img/guides/linkedin_login.png)
## Optional: Add ZITADEL action to autofill userdata
<PrefillAction fields="firstname, lastname, username, email and email verified" provider="LinkedIn"/>
```js reference
https://github.com/zitadel/actions/blob/main/examples/linkedin_identity_provider.js
```

View File

@ -344,12 +344,13 @@ module.exports = {
"guides/integrate/identity-providers/apple",
"guides/integrate/identity-providers/ldap",
"guides/integrate/identity-providers/openldap",
"guides/integrate/identity-providers/migrate",
"guides/integrate/identity-providers/okta-oidc",
"guides/integrate/identity-providers/okta-saml",
"guides/integrate/identity-providers/keycloak",
"guides/integrate/identity-providers/linkedin-oauth",
"guides/integrate/identity-providers/mocksaml",
"guides/integrate/identity-providers/jwt-idp",
"guides/integrate/identity-providers/migrate",
"guides/integrate/identity-providers/additional-information",
],
},

Binary file not shown.

After

Width:  |  Height:  |  Size: 315 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 113 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 140 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 325 KiB

After

Width:  |  Height:  |  Size: 295 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 216 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB