Migrating to Universal Login from Lock

[ruben1]

Hi!!
So we were using the Lock authentication without problems for a couple of months but now we want to use the mobile version and decided the best bet was to migrate to Universal Login. We are using auth0-hooks and can successfully create new users. However, we are not able to handle user data correctly after log in.
We read this issue

Import auth0 issue - july 16 migration

We are migrating from Auth0-Lock 10.x to Universal Login. Our stack is Node.js server and React client. Before, we used auth0-lock version 10.2.2: import Auth0Lock from ‘auth0-lock’ lock = new Auth0Lock(clientId, domain, cfg) Now, we are trying to use auth0-js version 9.6.1: const AuthenticationClient = require(‘auth0’).AuthenticationClient; var auth0Client = new AuthenticationClient({domain, clientId}); lock = new auth0Client.WebAuth() We get the webpack build error: ERROR in ./src/utils/…

and the documentation but I can’t find the complete guide on what we should do with these variables:
this.lock = new Auth0Lock(props.clientId, props.domain, props.options);
this.tokenRenewalTimeout = null;
this.state = {
lock: this.lock,
login: this.login,
logout: this.logout,
isAuth: false
};
}

[stephanie.chamblee]

Hi @ruben1,

Welcome to the Community!

Just to make sure I understand what you are looking to do, are you planning to migrate from an embedded login to Universal Login? Or are you migrating from the Classic Universal Login Experience to the New Universal Login Experience?

[ruben1]

Hi! Yes, I want to migrate from embedded login to Universal Login. We had to change it to Universal since the embedded one wasn’t working on some mobile devices. I am using Next js and auth0-react-hooks. The log in and sign up are done correctly but we are unable to get the access token afterwards and use the session info.It seemed to be an easy process but it’s much harder than we thought. I found this previous issue that seemed to indicate we had to change the authlocks with webAuth.

[stephanie.chamblee]

I see! a new SDK was just released a couple of weeks abo specifically for Next.js. I’d suggest taking a look at the Next.js Quickstart if you haven’t already: Auth0 Next.js SDK Quickstarts: Login

There is an example in the quickstart of retrieving an Access Token

import { getAccessToken, withApiAuthRequired } from '@auth0/nextjs-auth0';

export default withApiAuthRequired(async function shows(req, res) {
  try {
    const { accessToken } = await getAccessToken(req, res, {
      scopes: ['read:shows']
    });
    const apiPort = process.env.API_PORT || 3001;
    const response = await fetch(`http://localhost:${apiPort}/api/shows`, {
      headers: {
        Authorization: `Bearer ${accessToken}`
      }
    });
    const shows = await response.json();

    res.status(200).json(shows);
  } catch (error) {
    res.status(error.status || 500).json({ error: error.message });
  }
});