Account Linking with Next JS and Auth0

[dpramanik]

Hi

In my nextjs application I have a user settings page which has a ‘Link Google’ button. The desired functionality is, users should be able to link their google accounts. That can be with the same email they logged in with or a different email. How can we achieve that ?

I am using the nextjs-auth0 package and universal login.

Thanks
Debabrata Pramanik

[ricardo.batista]

Hi @dpramanik

You should be able to use the user account linking for this. Specifically the User-initiated account linking , which would allow your users to link their accounts using an admin screen in your app, as you’ve specified.

You can check an example implementation here: User-Initiated Account Linking: Client-Side Implementation

[dpramanik]

Hey @ricardo.batista, thanks for replying.
Yes I am following the link you shared, but am having few issues.
Firstly, I am using nextjs-auth0 library with universal login and my app is a regular web app.

The steps that I am doing are as follows:

• Lets’s assume that a user has signed in normally with email and password and now he goes to his settings page and clicks the link facebook button. At this point I am redirecting them to /api/auth/login?type=facebook. Why I am passing this type is because I wanted to show the users the facebook login screen. Else, since the user is already logged in it will redirect the user to the logged in homepage.

• Now inside […auth0.js] → handleAuth → login function, I am catching that type. If type is there, which indicates that account linking was initiated, I am calling the handleLogin function having authorizationParams with connection as type. When user goes through this process, a new user fb user is created inside auth0. (I have doubt here, as I don’t want that new user to be created inside auth0, but at the same time I need that login screen and idToken of the new user.). Before this process, I have the type and sub of the primary logged in user stored in local variables(as we will need them to call the management api).

• Now when the new fb user authenticates, inside afterCallback, I am taking the idToken from session and calling the managementAPI. But the call fails.

I am certain that something is missing from my flow.

Thanks
Debabrata Pramanik

[dpramanik]

The above flow seems to be working. After a successful call back from the management api, the accounts are getting merged into one. We get back the session of the new user as expected inside afterCallback function, we will need to handle these. The management api call goes like the follow.

Thanks @ricardo.batista. I will close this for now.

await fetch(`${domain}/api/v2/users/${sub}/identities`, { // sub / user id of the primary user
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${token}`, // management api token
    },
    body: JSON.stringify({
      provider: type,  // connection type
      user_id: session.user.sub, // secondary user id
    }),
  });

[konrad.sopala]

Thanks! Let us know if you have any other questions down the road!