다음을 통해 공유

MSAL.js를 사용하여 인증 요청에서 사용자 지정 상태 전달

  • 아티클

OAuth 2.0에서 정의된 state 매개 변수는 인증 요청에 포함되며 교차 사이트 요청 위조 공격을 방지하기 위해 토큰 응답에서도 반환됩니다. 기본적으로 JavaScript용 Microsoft 인증 라이브러리(MSAL.js)는 인증 요청에서 임의로 생성된 고유 state 매개 변수 값을 전달합니다.

state 매개 변수를 사용하여 리디렉션 전에 앱 상태 정보를 인코딩할 수도 있습니다. 이 매개 변수에 대한 입력으로 앱의 사용자 상태(예: 사용자가 있었던 페이지 또는 보기)를 전달할 수 있습니다. MSAL.js 라이브러리를 사용하면 사용자 지정 상태를 요청 개체의 상태 매개 변수로 전달할 수 있습니다. 예시:

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);

전달된 상태는 요청을 보낼 때 MSAL.js에서 설정된 고유 GUID에 추가됩니다. 응답이 반환되면 MSAL.js는 상태 일치를 확인한 다음, 사용자 지정 전달된 상태를 Response 개체에서 state로 반환합니다.

다음 단계

여러 부분으로 구성된 다음 자습서 시리즈에서 사용자를 로그인시키는 React SPA(단일 페이지 애플리케이션)를 빌드하여 자세히 알아봅니다.