서비스 주체를 사용하여 로컬 개발 중에 Azure 서비스에 JavaScript 앱 인증
클라우드 애플리케이션을 만들 때 개발자는 로컬 워크스테이션에서 애플리케이션을 디버그하고 테스트해야 합니다. 로컬 개발 중에 개발자의 워크스테이션에서 애플리케이션을 실행하는 경우에도 앱에서 사용하는 모든 Azure 서비스에 인증해야 합니다. 이 문서에서는 로컬 개발 중에 사용할 전용 애플리케이션 서비스 주체 개체를 설정하는 방법을 다룹니다.
로컬 개발을 위한 전용 애플리케이션 서비스 주체를 사용하면 앱 개발 중에 최소 권한 원칙을 따를 수 있습니다. 권한 범위는 개발 중에 앱에 필요한 범위로 정확하게 지정되므로 앱 코드가 다른 앱에서 사용하기 위한 Azure 리소스에 실수로 액세스하지 못하게 됩니다. 또한 이 메서드는 앱이 개발 환경에서 과도하게 사용되었기 때문에 앱을 프로덕션으로 이동할 때 버그가 발생하지 않도록 방지합니다.
앱이 Azure에 등록되면 앱에 대한 애플리케이션 서비스 주체가 설정됩니다. 로컬 개발을 위해 앱을 등록할 때 다음을 수행하는 것이 좋습니다.
- 앱에서 작업하는 각 개발자에 대해 별도의 앱 등록을 만듭니다. 이 메서드는 각 개발자가 로컬 개발 중에 사용할 별도의 애플리케이션 서비스 주체를 만들고 개발자가 단일 애플리케이션 서비스 주체에 대한 자격 증명을 공유할 필요가 없도록 합니다.
- 앱별로 별도의 앱 등록을 만듭니다. 이는 앱에 필요한 권한으로만 앱의 권한 범위를 지정합니다.
로컬 개발 중에 환경 변수는 애플리케이션 서비스 주체의 ID로 설정됩니다. JavaScript용 Azure SDK는 이러한 환경 변수를 읽고 이 정보를 사용하여 필요한 Azure 리소스에 앱을 인증합니다.
1 - Azure에 애플리케이션 등록
애플리케이션 서비스 주체 개체는 Azure에서 앱 등록을 통해 만들어집니다. Azure Portal 또는 Azure CLI를 사용하여 서비스 주체를 만들 수 있습니다.
Azure Portal에 로그인하고 다음 단계를 따릅니다.
| 지침 | 스크린샷 |
|---|---|
Azure Portal에서 다음을 수행합니다.
|
|
| 앱 등록 페이지에서 + 신규 등록 을 선택합니다. | 
|
애플리케이션 등록 페이지에서 다음과 같이 양식을 작성합니다.
|
|
앱의 앱 등록 페이지에서:
|
|
| 인증서 및 비밀 페이지에서 + 새 클라이언트 암호를 선택합니다. | 
|
클라이언트 암호 추가 대화 상자가 페이지 오른쪽에 나타납니다. 이 대화 상자에서:
|
|
| 인증서 및 암호 페이지에 클라이언트 암호 값이 표시됩니다. 이 값은 이후 단계에서 필요하므로 텍스트 편집기에서 임시 위치에 복사합니다. 중요: 이 값을 볼 수 있는 유일한 시간입니다. 이 페이지를 나가거나 새로 고치면 이 값을 다시 볼 수 없습니다. 이 클라이언트 비밀을 무효화하지 않고 클라이언트 비밀을 더 추가할 수 있지만 이 값은 다시 표시되지 않습니다. |
|
2 - 로컬 개발을 위한 Microsoft Entra 보안 그룹 만들기
일반적으로 애플리케이션에서 작업하는 여러 개발자가 있으므로 개별 서비스 주체 개체에 역할을 할당하는 대신 앱이 로컬 개발에 필요한 역할(권한)을 캡슐화하는 Microsoft Entra 그룹을 만드는 것이 좋습니다. 이는 다음과 같은 이점을 제공합니다.
- 역할은 그룹 수준에서 할당되므로 모든 개발자는 동일한 역할을 할당받게 됩니다.
- 앱에 새 역할이 필요한 경우 앱에 대한 Microsoft Entra 그룹에만 추가하면 됩니다.
- 새로운 개발자가 팀에 합류하면 개발자를 위한 새로운 애플리케이션 서비스 주체가 만들어져 그룹에 추가되어 개발자에게 앱 작업에 대한 올바른 권한이 있는지 확인합니다.
| 지침 | 스크린샷 |
|---|---|
| 페이지 맨 위에 있는 검색 상자에 Microsoft Entra ID를 입력한 다음 서비스에서 Microsoft Entra ID 를 선택하여 Azure Portal의 Microsoft Entra ID 페이지로 이동합니다. | 
|
| Microsoft Entra ID 페이지의 왼쪽 메뉴에서 그룹을 선택합니다. | 
|
| 모든 그룹 페이지에서 새 그룹을 선택합니다. | 
|
새 그룹 페이지에서:
|
|
멤버 추가 대화 상자에서 다음을 수행합니다.
|
|
| 새 그룹 페이지로 돌아가서 만들기를 선택하여 그룹을 만듭니다. 그룹이 만들어지고 모든 그룹 페이지로 돌아갑니다. 그룹이 표시되는 데 최대 30초가 걸릴 수 있으며 Azure Portal의 캐싱으로 인해 페이지를 새로 고쳐야 할 수도 있습니다. |
|
3 - 애플리케이션에 역할 할당
다음으로, 어떤 리소스에 대해 앱에 필요한 역할(권한)을 결정하고 해당 역할을 앱에 할당해야 합니다. 이 예제에서는 2단계에서 만든 Microsoft Entra 그룹에 역할이 할당됩니다. 역할은 리소스, 리소스 그룹 또는 구독 범위에서 역할을 할당할 수 있습니다. 이 예제에서는 대부분의 애플리케이션이 모든 Azure 리소스를 단일 리소스 그룹으로 그룹화하기 때문에 리소스 그룹 범위에서 역할을 할당하는 방법을 보여 줍니다.
| 지침 | 스크린샷 |
|---|---|
| Azure Portal 상단에 있는 검색 상자를 통해 리소스 그룹 이름을 검색하여 애플리케이션에 대한 리소스 그룹을 찾습니다. 대화 상자의 리소스 그룹 제목 아래에서 리소스 그룹 이름을 선택하여 리소스 그룹으로 이동합니다. |
|
| 리소스 그룹 페이지의 왼쪽 메뉴에서 액세스 제어(IAM)를 선택합니다. | 
|
액세스 제어(IAM) 페이지에서 다음을 수행합니다.
|
|
역할 할당 추가 페이지에는 리소스 그룹에 할당할 수 있는 모든 역할이 나열됩니다.
|
|
다음 역할 할당 추가 페이지에서는 역할을 할당할 사용자를 할당할 수 있습니다.
|
|
멤버 선택 대화 상자에서:
|
|
| 역할 할당 추가 화면에 Microsoft Entra 그룹이 선택된 것으로 표시됩니다. 검토 + 할당을 선택하여 최종 페이지로 이동한 다음 다시 검토 + 할당을 선택하여 프로세스를 완료합니다. |
|
4 - 로컬 개발 환경 변수 설정
이 개체는 DefaultAzureCredential 런타임에 환경 변수 집합에서 서비스 주체 정보를 찾습니다. 대부분의 개발자는 여러 애플리케이션에서 작업하므로 개발 중에 애플리케이션 디렉터리에 저장된 파일에서 .env 환경에 액세스하기 위해 dotenv와 같은 패키지를 사용하는 것이 좋습니다. 이 범위는 이 애플리케이션에서만 사용할 수 있도록 Azure에 애플리케이션을 인증하는 데 사용되는 환경 변수의 범위를 지정합니다.
파일이 .env Azure에 대한 애플리케이션 비밀 키를 포함하기 때문에 소스 제어에 체크 인되지 않습니다. JavaScript용 표준 .gitignore 파일은 체크 인에서 파일을 자동으로 제외합니다 .env .
패키지를 사용 dotenv 하려면 먼저 애플리케이션에 패키지를 설치합니다.
npm install dotenv
그런 다음 애플리케이션 루트 디렉터리에 파일을 만듭니 .env 다. 다음과 같이 앱 등록 프로세스에서 가져온 값으로 환경 변수 값을 설정합니다.
AZURE_CLIENT_ID→ 앱 ID 값입니다.AZURE_TENANT_ID→ 테넌트 ID 값입니다.AZURE_CLIENT_SECRET→ 앱에 대해 생성된 암호/자격 증명입니다.
AZURE_CLIENT_ID=00001111-aaaa-2222-bbbb-3333cccc4444
AZURE_TENANT_ID=ffffaaaa-5555-bbbb-6666-cccc7777dddd
AZURE_CLIENT_SECRET=Aa1Bb~2Cc3.-Dd4Ee5Ff6Gg7Hh8Ii9_Jj0Kk1Ll2
마지막으로 애플리케이션의 시작 코드에서 라이브러리를 dotenv 사용하여 시작 시 파일에서 환경 변수를 .env 읽습니다.
import 'dotenv/config'
5 - 애플리케이션에 DefaultAzureCredential 구현
Azure에 Azure SDK 클라이언트 개체를 인증하려면 애플리케이션에서 패키지의 클래스를 DefaultAzureCredential @azure/identity 사용해야 합니다. 이 시나리오 DefaultAzureCredential 에서는 환경 변수를 AZURE_CLIENT_IDAZURE_TENANT_ID검색하고 AZURE_CLIENT_SECRET 해당 변수를 설정하고 읽어 Azure에 연결할 애플리케이션 서비스 주체 정보를 가져옵니다.
먼저 애플리케이션에 @azure/ID 패키지를 추가합니다.
npm install @azure/identity
다음으로, 앱에서 Azure SDK 클라이언트 개체를 만드는 JavaScript 코드의 경우 다음을 수행합니다.
- 모듈에서
DefaultAzureCredential클래스를@azure/identity가져옵니다. DefaultAzureCredential개체를 만듭니다.- 개체를
DefaultAzureCredentialAzure SDK 클라이언트 개체 생성자에 전달합니다.
이 예제는 다음 코드 세그먼트에 나와 있습니다.
// Azure authentication dependency
import { DefaultAzureCredential } from '@azure/identity';
// Azure resource management dependency
import { SubscriptionClient } from "@azure/arm-subscriptions";
// Acquire credential
const tokenCredential = new DefaultAzureCredential();
async function listSubscriptions() {
try {
// use credential to authenticate with Azure SDKs
const client = new SubscriptionClient(tokenCredential);
// get details of each subscription
for await (const item of client.subscriptions.list()) {
const subscriptionDetails = await client.subscriptions.get(
item.subscriptionId
);
/*
Each item looks like:
{
id: '/subscriptions/aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e',
subscriptionId: 'aaaa0a0a-bb1b-cc2c-dd3d-eeeeee4e4e4e',
displayName: 'YOUR-SUBSCRIPTION-NAME',
state: 'Enabled',
subscriptionPolicies: {
locationPlacementId: 'Internal_2014-09-01',
quotaId: 'Internal_2014-09-01',
spendingLimit: 'Off'
},
authorizationSource: 'RoleBased'
},
*/
console.log(subscriptionDetails);
}
} catch (err) {
console.error(JSON.stringify(err));
}
}
listSubscriptions()
.then(() => {
console.log("done");
})
.catch((ex) => {
console.log(ex);
});
DefaultAzureCredential 는 앱에 대해 구성된 인증 메커니즘을 자동으로 검색하고 Azure에 앱을 인증하는 데 필요한 토큰을 가져옵니다. 애플리케이션에서 둘 이상의 SDK 클라이언트를 사용하는 경우 각 SDK 클라이언트 개체와 동일한 자격 증명 개체를 사용할 수 있습니다.