Inicio de sesión único con MASL.js

El inicio de sesión único (SSO) proporciona una experiencia más fluida al reducir el número de veces que se solicitan sus credenciales a los usuarios. Los usuarios escriben sus credenciales una vez y otras aplicaciones del dispositivo pueden reutilizar la sesión establecida sin necesidad de más confirmaciones.

Azure Active Directory (Azure AD) permite el SSO al establecer una cookie de sesión cuando un usuario se autentica por primera vez. MSAL.js permite el uso de la cookie de sesión para el SSO entre las pestañas del explorador abiertas para una o varias aplicaciones.

Inicio de sesión único entre pestañas del explorador para la misma aplicación

Cuando un usuario tiene abierta la aplicación en varias pestañas e inicia sesión en una de ellas, puede iniciar sesión en la misma aplicación abierta en las demás pestañas sin que se le pida confirmación. Para ello, tendrá que establecer cacheLocation en el objeto de configuración localStorage de MSAL.js como se muestra a continuación.

const config = {
  auth: {
    clientId: "1111-2222-3333-4444-55555555",
  },
  cache: {
    cacheLocation: "localStorage",
  },
};

const msalInstance = new msal.PublicClientApplication(config);

Inicio de sesión único entre diferentes aplicaciones

Cuando un usuario se autentica, se establece una cookie de sesión en el dominio de Azure AD del explorador. MSAL.js se basa en esta cookie de sesión para proporcionar un inicio de sesión único al usuario entre diferentes aplicaciones. MSAL.js también almacena en caché los tokens de identificador y tokens de acceso del usuario en el almacenamiento del explorador por dominio de aplicación.

MSAL.js ofrece el método ssoSilent para iniciar la sesión del usuario y obtener tokens sin interacción. Pero si el usuario tiene varias cuentas de usuario en la sesión con Azure AD, se le pedirá que elija la cuenta adecuada para iniciar sesión. Por tanto, hay dos maneras de lograr el inicio de sesión único con el método ssoSilent.

Con sugerencia de usuario

Para mejorar el rendimiento y asegurarse de que el servidor de autorización buscará la sesión de cuenta correcta. Puede pasar una de las opciones siguientes en el objeto de solicitud del método ssoSilent para obtener el token de forma silenciosa.

  • Identificador de sesión sid (que se puede recuperar del valor idTokenClaims de un objeto account)
  • login_hint (que se puede recuperar de la propiedad de nombre de usuario del objeto account o de la notificación upn en el token de identificador)
  • account (que se puede recuperar mediante uno de los métodos de cuenta)

Uso de un id. de sesión

Para usar un id. de sesión, agregue sid como una notificación opcional a los tokens de id. de la aplicación. La notificación sid permite a la aplicación identificar la sesión de Azure AD de un usuario independientemente del nombre de la cuenta o del nombre de usuario. Para aprender a agregar las notificaciones opcionales como sid, consulte Proporcionar notificaciones opcionales a la aplicación. Use el id. de sesión (SID) en las solicitudes de autenticación silenciosas que haga con ssoSilent en MSAL.js.

const request = {
  scopes: ["user.read"],
  sid: sid,
};

 try {
    const loginResponse = await msalInstance.ssoSilent(request);
} catch (err) {
    if (err instanceof InteractionRequiredAuthError) {
        const loginResponse = await msalInstance.loginPopup(request).catch(error => {
            // handle error
        });
    } else {
        // handle error
    }
}

Uso de una sugerencia de inicio de sesión

Para omitir la solicitud de selección de cuentas que se muestra normalmente durante las solicitudes de autenticación interactivas (o para las solicitudes silenciosas, cuando no ha configurado la notificación opcional sid), proporcione loginHint. En las aplicaciones multiinquilino, también incluya domain_hint.

const request = {
  scopes: ["user.read"],
  loginHint: preferred_username,
  extraQueryParameters: { domain_hint: "organizations" },
};

try {
    const loginResponse = await msalInstance.ssoSilent(request);
} catch (err) {
    if (err instanceof InteractionRequiredAuthError) {
        const loginResponse = await msalInstance.loginPopup(request).catch(error => {
            // handle error
        });
    } else {
        // handle error
    }
}

Obtenga los valores de loginHint y domain_hint del token de id. del usuario:

  • loginHint: use el valor de notificación preferred_username del token de id.

  • domain_hint: use el valor de notificación tid del token de id. Necesario en las solicitudes realizadas por aplicaciones multiinquilino que usan la autoridad /common. Opcional para otras aplicaciones.

Para obtener más información sobre la sugerencia de inicio de sesión y la sugerencia de dominio, consulte Plataforma de identidad de Microsoft y flujo de código de autorización de OAuth 2.0.

Uso de un objeto de cuenta

Si conoce la información de la cuenta de usuario, también puede recuperar la cuenta de usuario mediante los métodos getAccountByUsername() o getAccountByHomeId():

const username = "test@contoso.com";
const myAccount  = msalInstance.getAccountByUsername(username);

const request = {
    scopes: ["User.Read"],
    account: myAccount
};

try {
    const loginResponse = await msalInstance.ssoSilent(request);
} catch (err) {
    if (err instanceof InteractionRequiredAuthError) {
        const loginResponse = await msalInstance.loginPopup(request).catch(error => {
            // handle error
        });
    } else {
        // handle error
    }
}

Sin sugerencia de usuario

Puede intentar usar el método ssoSilent sin pasar account, sid ni login_hint, como se muestra en el código siguiente:

const request = {
    scopes: ["User.Read"]
};

try {
    const loginResponse = await msalInstance.ssoSilent(request);
} catch (err) {
    if (err instanceof InteractionRequiredAuthError) {
        const loginResponse = await msalInstance.loginPopup(request).catch(error => {
            // handle error
        });
    } else {
        // handle error
    }
}

Pero hay una probabilidad de errores de inicio de sesión silenciosos si la aplicación tiene varios usuarios en una sola sesión del explorador, o bien si el usuario tiene varias cuentas para esa sesión de explorador único. Es posible que vea el siguiente error en el caso de varias cuentas:

InteractionRequiredAuthError: interaction_required: AADSTS16000: Either multiple user identities are available for the current request or selected account is not supported for the scenario.

El error indica que el servidor no ha podido determinar en qué cuenta iniciar sesión y necesitará uno de los parámetros anteriores (account, login_hint, sid), o bien un inicio de sesión interactivo para elegir la cuenta.

Consideraciones al usar ssoSilent

URI de redirección (URL de respuesta)

Para mejorar el rendimiento y ayudar a evitar problemas, establezca redirectUri en una página en blanco u otra página que no use MSAL.

  • Si la aplicación solo usa métodos emergentes y silenciosos, establezca redirectUri en el objeto de configuración PublicClientApplication.
  • Si la aplicación también usa métodos de redireccionamiento, establezca el valor redirectUri en cada solicitud.

Cookies de terceros

ssoSilent intenta abrir un elemento iframe oculto y reutilizar una sesión existente con Azure AD. Esto no funcionará en exploradores que bloquean las cookies de terceros, como Safari, y provocará un error de interacción:

InteractionRequiredAuthError: login_required: AADSTS50058: A silent sign-in request was sent but no user is signed in. The cookies used to represent the user's session were not sent in the request to Azure AD

Para resolver el error, el usuario debe crear una solicitud de autenticación interactiva mediante loginPopup() o loginRedirect().

Además, el objeto de solicitud es necesario cuando se usan los métodos silenciosos. Si ya tiene la información de inicio de sesión del usuario, puede pasar los parámetros opcionales loginHint o sid para iniciar sesión en una cuenta específica.

Inicio de sesión único en ADAL.js para la actualización de MSAL.js

MSAL.js aporta paridad de características con ADAL.js para escenarios de autenticación de Azure AD. Para facilitar la migración de ADAL.js a MSAL.js y no tener que pedir a los usuarios que vuelvan a iniciar sesión, la biblioteca lee el token de identificación que representa la sesión del usuario en la memoria caché de ADAL.js e inicia la sesión del usuario en MSAL.js.

Para poder aprovechar el comportamiento de SSO al realizar la actualización desde ADAL.js, deberá asegurarse de que las bibliotecas usan localStorage para almacenar los tokens en caché. Al inicializar, establezca cacheLocation en localStorage en la configuración tanto de MSAL.js como de ADAL.js de la manera siguiente:


// In ADAL.js
window.config = {
  clientId: "1111-2222-3333-4444-55555555",
  cacheLocation: "localStorage",
};

var authContext = new AuthenticationContext(config);

// In latest MSAL.js version
const config = {
  auth: {
    clientId: "1111-2222-3333-4444-55555555",
  },
  cache: {
    cacheLocation: "localStorage",
  },
};

const msalInstance = new msal.PublicClientApplication(config);

Una vez que se configure cacheLocation, MSAL.js puede leer el estado en caché del usuario autenticado en ADAL.js y usarlo para proporcionar el inicio de sesión único en MSAL.js.

Pasos siguientes

Para más información sobre SSO, vea lo siguiente: