Migración de MSAL v1.x a MSAL v2.x

Si no está familiarizado con MSAL, debería empezar aquí. Si procede de MSAL v1.x, puede seguir esta guía para actualizar el código para usar MSAL v2.x.

1. Actualizar el registro de la aplicación

Vaya al Centro de administración Microsoft Entra del inquilino y revise los registros de aplicaciones. Puede crear un nuevo registro para MSAL 2.x o puede actualizar el registro existente para el registro que usa para MSAL 1.x.

2. Agregar el msal-browser paquete al proyecto

Con npm, use lo siguiente:

npm install @azure/msal-browser

3. Actualización del código

En MSAL 1.x, ha creado una instancia de aplicación como se indica a continuación:

import * as msal from "msal";

const msalInstance = new msal.UserAgentApplication(config);

En MSAL 2.x, puede actualizarlo para usar el nuevo PublicClientApplication objeto.

import * as msal from "@azure/msal-browser";

const msalInstance = new msal.PublicClientApplication(config);

Puede haber algunas pequeñas diferencias en el objeto de configuración que se pasa. Si va a pasar una configuración más avanzada al UserAgentApplication objeto, consulte aquí para obtener más información sobre las nuevas opciones de configuración de objetos de aplicación.

Las firmas de objeto de solicitud y respuesta han cambiado: acquireTokenSilent ahora tiene una firma de objeto independiente de las API interactivas. Consulte aquí para obtener más información sobre cómo configurar las API de solicitud.

La mayoría de las API de MSAL 1.x se han trasladado a MSAL 2.x sin cambios. Se han quitado algunas funciones:

  • handleRedirectCallback
  • urlContainsHash
  • getCurrentConfiguration
  • getLoginInProgress
  • getAccount
  • getAccountState
  • isCallback

En MSAL 2.x, controlar la respuesta del hash es una operación asincrónica, ya que MSAL realizará un intercambio de tokens en cuanto analiza el código de autorización de la respuesta. Por este motivo, al realizar llamadas de redirección, MSAL proporciona la handleRedirectPromise función que devolverá una promesa que se resuelve cuando MSAL controle completamente la redirección. Cuando se usa un método de redireccionamiento, la página que se usa como redirectUri debe implementar handleRedirectPromise para asegurarse de que la respuesta se controla y los tokens se almacenan en caché al volver desde el redireccionamiento.

const myMSALObj = new msal.PublicClientApplication(msalConfig); 

// Register Callbacks for Redirect flow
myMSALObj.handleRedirectPromise().then((tokenResponse) => {
    let accountObj = null;
    if (tokenResponse !== null) {
        accountObj = tokenResponse.account;
        const id_token = tokenResponse.idToken;
        const access_token = tokenResponse.accessToken;
    } else {
        const currentAccounts = myMSALObj.getAllAccounts();
        if (!currentAccounts || currentAccounts.length === 0) {
            // No user signed in
            return;
        } else if (currentAccounts.length > 1) {
            // More than one user signed in, find desired user with getAccountByUsername(username)
        } else {
            accountObj = currentAccounts[0];
        }
    }
    
    const username = accountObj.username;
   
}).catch((error) => {
    handleError(error);
});

function signIn() {
    myMSALObj.loginRedirect(loginRequest);
}

async function getTokenRedirect(request) {
    return await myMSALObj.acquireTokenSilent(request).catch(error => {
        this.logger.info("silent token acquisition fails. acquiring token using redirect");
        // fallback to interaction when silent call fails
        return myMSALObj.acquireTokenRedirect(request)
    });
}

Durante las llamadas loginPopup, acquireTokenPopup o acquireTokenSilent, puede esperar a que se resuelva la promesa.

const myMSALObj = new msal.PublicClientApplication(msalConfig); 

async function signIn(method) {
    try {
        const loginResponse = await myMSALObj.loginPopup(loginRequest);
    } catch (err) {
        handleError(error);
    }

    const currentAccounts = myMSALObj.getAllAccounts();
    if (!currentAccounts || currentAccounts.length === 0) {
        // No user signed in
        return;
    } else if (currentAccounts.length > 1) {
        // More than one user signed in, find desired user with getAccountByUsername(username)
    } else {
        accountObj = currentAccounts[0];
    }
}

async function getTokenPopup(request) {
    return await myMSALObj.acquireTokenSilent(request).catch(async (error) => {
        this.logger.info("silent token acquisition fails. acquiring token using popup");
        // fallback to interaction when silent call fails
        return await myMSALObj.acquireTokenPopup(request).catch(error => {
            handleError(error);
        });
    });
}

Consulte los documentos de inicio de sesión y adquisición de tokens para obtener información más detallada sobre el uso.

Los tokens de actualización se devuelven ahora como parte de las respuestas de token, y la biblioteca los utiliza para renovar los tokens de acceso sin interacción ni uso de iframes. Consulte los documentos de vigencia de tokens para obtener más información sobre la renovación de tokens.

Todas las demás API deben funcionar como antes. Se recomienda echar un vistazo al ejemplo predeterminado para ver un ejemplo en funcionamiento de MSAL 2.0.

  • Last updated on