Paso del estado personalizado en solicitudes de autenticación con MSAL.js

El parámetro state , tal como se define en OAuth 2.0, se incluye en una solicitud de autenticación y también se devuelve en la respuesta del token para evitar ataques de falsificación de solicitudes entre sitios. De forma predeterminada, la biblioteca de autenticación de Microsoft para JavaScript (MSAL.js) pasa un valor de parámetro de estado único generado aleatoriamente en las solicitudes de autenticación.

El parámetro state también se puede usar para codificar información del estado de la aplicación antes de redirigirla. Puede pasar una referencia al estado del usuario en la aplicación, como un identificador para la página o la vista en la que estaban, como entrada para este parámetro. La biblioteca de MSAL.js permite pasar el estado personalizado como parámetro de estado en el objeto Request .

Importante

Para la seguridad y la privacidad, no coloque direcciones URL u otros datos confidenciales directamente en el parámetro state. En su lugar, use una clave o identificador que corresponda a los datos almacenados en el almacenamiento del explorador, como localStorage o sessionStorage. Este enfoque permite que la aplicación haga referencia de forma segura a los datos necesarios después de la autenticación. Por ejemplo, puede almacenar la dirección URL real en sessionStorage y pasar solo la clave de almacenamiento en el parámetro state.

Por ejemplo:

import {PublicClientApplication} from "@azure/msal-browser";

const myMsalObj = new PublicClientApplication({
    clientId: "ENTER_CLIENT_ID_HERE"
});

let loginRequest = {
    scopes: ["user.read"],
    state: "state_key"
}

myMSALObj.loginRedirect(loginRequest);

El estado pasado se anexa al GUID único establecido por MSAL.js al enviar la solicitud. Cuando se devuelve la respuesta, MSAL.js comprueba si hay una coincidencia de estado y, a continuación, devuelve el valor personalizado pasado en estado en el objeto Response como state.

Para obtener más información, lea sobre la creación de una aplicación de página única (SPA) mediante MSAL.js.