자습서: 네이티브 인증 JavaScript SDK에서 웹 대체 지원

적용 대상: 외부 테넌트(자세한 정보)

이 자습서에서는 네이티브 인증이 웹 대체라는 메커니즘을 사용하여 인증 흐름을 완료하기에 충분하지 않은 브라우저 기반 인증을 통해 보안 토큰을 획득하는 방법을 보여 줍니다.

웹 대체를 사용하면 네이티브 인증을 사용하는 클라이언트 앱이 복원력을 향상시키기 위한 대체 메커니즘으로 브라우저 위임 인증을 사용할 수 있습니다. 이 시나리오는 네이티브 인증이 인증 흐름을 완료하기에 충분하지 않은 경우에 발생합니다. 예를 들어 권한 부여 서버에 클라이언트가 제공할 수 없는 기능이 필요한 경우입니다. 웹 대체에 대해 자세히 알아봅니다.

이 자습서에서는 다음을 수행합니다.

필수 조건

웹 대체 확인 및 처리

JavaScript SDK signIn() 또는 SignUp() 메서드를 사용할 때 발생할 수 있는 오류 중 하나는 다음과 같은 오류입니다 result.error?.isRedirectRequired(). 유틸리티 메서드 isRedirectRequired() 는 브라우저 위임 인증으로 대체해야 하는 필요성을 확인합니다. 웹 대체를 지원하려면 다음 코드 조각을 사용합니다.

const result = await authClient.signIn({
         username,
     });

if (result.isFailed()) {
   if (result.error?.isRedirectRequired()) {
      // Fallback to the delegated authentication flow.
      const popUpRequest: PopupRequest = {
         authority: customAuthConfig.auth.authority,
         scopes: [],
         redirectUri: customAuthConfig.auth.redirectUri || "",
         prompt: "login", // Forces the user to enter their credentials on that request, negating single-sign on.
      };

      try {
         await authClient.loginPopup(popUpRequest);

         const accountResult = authClient.getCurrentAccount();

         if (accountResult.isFailed()) {
            setError(
                  accountResult.error?.errorData?.errorDescription ??
                     "An error occurred while getting the account from cache"
            );
         }

         if (accountResult.isCompleted()) {
            result.state = new SignInCompletedState();
            result.data = accountResult.data;
         }
      } catch (error) {
         if (error instanceof Error) {
            setError(error.message);
         } else {
            setError("An unexpected error occurred while logging in with popup");
         }
      }
   } else {
         setError(`An error occurred: ${result.error?.errorData?.errorDescription}`);
   }
}

앱에서 대체 메커니즘을 사용하는 경우 앱은 이 메서드를 사용하여 보안 토큰을 loginPopup() 획득합니다.

관련 콘텐츠

• 웹 대체에 대해 자세히 알아봅니다.
• 네이티브 인증 챌린지 유형에 대해 자세히 알아봅니다.