How to Use the Auth0 Account Link Extension to Link Accounts

Problem statement:

Auth0 supports the linking of user accounts from various identity providers. This allows users to authenticate from any of their accounts and still be recognized by your app and associated with the same user profile.

Auth0 has an easy-to-use extension to help users link accounts. With this extension installed, when users log in to a web application with the same email but a different type of connection, they can choose to link the accounts.

Solution:

https://auth0.com/docs/customize/extensions/account-link-extension

  1. On the Auth0 dashboard, Extensions → All Extensions → search “Auth0 Account Link” and click on it to install.
  2. Once the installation is completed, the “auth0-account-link” application is visible under Applications. And the rule “auth0-account-link-extension” is created as well.
  3. Create a testing React Sample SPA, download the project, add domain, clientId, and audience in the auth_config.json file, and add http://localhost:3000 in the “Allowed Callback URLs”, “Allowed Logout URLs”, “Allowed Web Origins” field.
  4. Log in http://localhost:3000, select a connection and enter an email address that is already associated with a verified user with a different type of connection.
  5. On the Link account page, click on “continue”.
  6. Once logged in, check the user details on the Auth0 dashboard, we can see the user accounts are linked.

Note:

  1. We can only link the verified user accounts
  2. Only the accounts with the same email can be linked with the Auth0 extension.
  3. In the account linking pop-up, if a user denied the linking by clicking on “I want to skip this and create a new account (Not recommended) option, the new account will not be linked with the existing account.

Recording:

3 Likes