조정된 인증을 사용하여 로컬 개발 중에 Azure 서비스에 JavaScript 앱 인증

조정된 인증은 시스템 인증 브로커를 사용하여 사용자 자격 증명을 수집하여 앱을 인증합니다. 시스템 인증 브로커는 연결된 모든 계정에 대한 인증 핸드셰이크 및 토큰 유지 관리를 관리하는 사용자의 컴퓨터에서 실행되는 앱입니다.

조정된 인증은 다음과 같은 이점을 제공합니다.

• SSO(Single Sign-On 사용): 앱에서 사용자가 Microsoft Entra ID로 인증하는 방법을 간소화하고 Microsoft Entra ID 새로 고침 토큰을 반출 및 오용으로부터 보호할 수 있습니다.
• 향상된 보안: 앱 논리를 업데이트할 필요 없이 브로커와 함께 많은 보안 향상 기능이 제공됩니다.
• 향상된 기능 지원: 브로커의 도움으로 개발자는 풍부한 OS 및 서비스 기능에 액세스할 수 있습니다.
• 시스템 통합: 브로커 플러그 앤 플레이를 기본 제공 계정 선택기와 함께 사용하는 애플리케이션을 통해 사용자는 동일한 자격 증명을 반복해서 다시 입력하는 대신 기존 계정을 빠르게 선택할 수 있습니다.
• 토큰 보호: 새로 고침 토큰이 디바이스에 바인딩되어 있는지 확인하고 앱이 디바이스 바인딩된 액세스 토큰을 획득할 수 있도록 합니다. 토큰 보호를 참조하세요.

조정된 인증을 위한 앱 구성

애플리케이션에서 조정된 인증을 사용하도록 설정하려면 다음 단계를 수행합니다.

1. Azure Portal에서 Microsoft Entra ID로 이동하고 왼쪽 메뉴에서 앱 등록을 선택합니다.

2. 앱에 대한 등록 을 선택한 다음 인증을 선택합니다.

3. 플랫폼 구성을 통해 앱 등록에 적절한 리디렉션 URI를 추가합니다.

   1. 플랫폼 구성에서+ 플랫폼 추가를 선택합니다.

   2. 플랫폼 구성에서 애플리케이션 유형(플랫폼)에 대한 타일을 선택하여 모바일 및 데스크톱 애플리케이션과 같은 설정을 구성합니다.

   3. 사용자 지정 리디렉션 URI에서 플랫폼에 대해 다음 리디렉션 URI를 입력합니다.

      Platform	리디렉션 URI
      Windows 10 이상 또는 WSL	ms-appx-web://Microsoft.AAD.BrokerPlugin/{your_client_id}
      macOS	msauth.com.msauth.unsignedapp://auth 서명되지 않은 앱의 경우 msauth.{bundle_id}://auth 서명된 앱의 경우
      리눅스	https://login.microsoftonline.com/common/oauth2/nativeclient

      앱 등록 {your_client_id} 창의 {bundle_id}로 바꾸거나 해당 ID로 바꿉 니다.

   4. 설정을 선택합니다.

   자세한 내용은 앱 등록에 리디렉션 URI 추가를 참조하세요.

4. 인증 창으로 돌아가서 고급 설정에서 공용 클라이언트 흐름 허용에 대해 예를 선택합니다.

5. 변경 내용을 적용하려면 저장을 선택합니다.

6. 특정 리소스에 대한 애플리케이션에 권한을 부여하려면 해당 리소스로 이동하고, API 권한을 선택하고, 액세스하려는 Microsoft Graph 및 기타 리소스를 사용하도록 설정합니다.

   중요합니다

   또한 처음으로 로그인할 때 애플리케이션에 동의를 부여하려면 테넌트 관리자여야 합니다.

역할 할당

조정된 인증으로 앱 코드를 성공적으로 실행하려면 Azure RBAC(역할 기반 액세스 제어)를 사용하여 사용자 계정 권한을 부여합니다. 관련 Azure 서비스에 대한 사용자 계정에 적절한 역할을 할당합니다. 다음은 그 예입니다.

• Azure Blob Storage: 스토리지 계정 데이터 기여자 역할을 할당합니다.
• Azure Key Vault: Key Vault 비밀 책임자 역할을 할당합니다.

앱이 지정된 경우 user_impersonation Access Azure Storage 에 대해 설정된 API 권한이 있어야 합니다(이전 섹션의 6단계). 이 API 권한을 통해 앱은 로그인하는 동안 동의가 부여된 후 로그인한 사용자를 대신하여 Azure Storage에 액세스할 수 있습니다.

코드 구현

Azure ID 라이브러리는 InteractiveBrowserCredential을 사용하여 조정된 인증을 지원합니다. 예를 들어 Node.js 콘솔 앱에서 InteractiveBrowserCredential를 사용하여 Azure Key Vault에 인증하려면 다음 단계를 수행합니다.

1. @azure/ID 및 @azure/identity-broker 패키지를 설치합니다.

   npm install @azure/identity @azure/identity-broker
   

2. broker 옵션을 사용하여 InteractiveBrowserCredential 의 인스턴스를 만들고 네이티브 브로커 플러그 인을 등록합니다.

   import { useIdentityPlugin, InteractiveBrowserCredential } from "@azure/identity";
   import { nativeBrokerPlugin } from "@azure/identity-broker";
   
   // Register the native broker plugin for brokered authentication
   useIdentityPlugin(nativeBrokerPlugin);
   
   // Use InteractiveBrowserCredential with broker for interactive or silent authentication
   
   // On Windows: Uses Windows Authentication Manager (WAM) - you'll be prompted to sign in
   // On macOS: Opens a browser window for authentication, since the broker flow isn't currently supported.
   // On Linux: Uses Microsoft Single Sign-on (SSO) for Linux.
   
   const credential = new InteractiveBrowserCredential({
       brokerOptions: {
           enabled: true,
           useDefaultBrokerAccount: true,
           // For Node.js console apps, we need to provide an empty buffer for parentWindowHandle
           parentWindowHandle: new Uint8Array(0),
       },
   });
   

앞의 예제에서 속성 useDefaultBrokerAccount 은 기본 시스템 계정으로 조정된 자동 인증 흐름을 옵트인하는 속성으로 설정 true됩니다. 이러한 방식으로 사용자는 동일한 계정을 반복적으로 선택할 필요가 없습니다. 자동, 조정된 인증이 실패하거나 useDefaultBrokerAccount 설정 falseInteractiveBrowserCredential 되면 대화형 조정된 인증으로 돌아갑니다.

관련 콘텐츠

• JavaScript용 Azure SDK를 사용하여 Azure 서비스에 JavaScript 앱 인증
• 로컬 개발 중 Azure 서비스에 JavaScript 앱 인증
• JavaScript용 Azure ID 라이브러리
• JavaScript용 Azure Identity Broker 라이브러리