Passar o estado personalizado em solicitações de autenticação usando MSAL.js

O parâmetro state, conforme definido pelo OAuth 2.0, é incluído em uma solicitação de autenticação e também é retornado na resposta do token para evitar ataques de falsificação de solicitação entre sites. Por padrão, a Biblioteca de Autenticação da Microsoft para JavaScript (MSAL.js) passa um valor de parâmetro de estado gerado aleatoriamente e exclusivo nas solicitações de autenticação.

O parâmetro state também pode ser usado para codificar informações do estado do aplicativo antes do redirecionamento. Você pode passar o estado do usuário no aplicativo, como a página ou a exibição em que ele estava, como entrada para esse parâmetro. A biblioteca de MSAL.js permite que você passe seu estado personalizado como parâmetro de estado no objeto Request. Por exemplo:

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

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

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

myMSALObj.loginRedirect(loginRequest);

O estado passado é anexado ao GUID exclusivo gerado por MSAL.js ao enviar a solicitação. Quando a resposta é retornada, MSAL.js verifica se há uma correspondência de estado e, em seguida, retorna o estado personalizado passado no objeto Response como state.

Próximos passos

Saiba mais criando uma aplicação de página única (SPA) React que autentica utilizadores na série de tutoriais , composta por várias partes.