Uwierzytelnianie aplikacji JavaScript w usługach platformy Azure podczas programowania lokalnego przy użyciu jednostek usługi

Podczas tworzenia aplikacji w chmurze deweloperzy muszą debugować i testować aplikacje na lokalnej stacji roboczej. Gdy aplikacja jest uruchamiana na stacji roboczej dewelopera podczas programowania lokalnego, nadal musi uwierzytelniać się w dowolnych usługach platformy Azure używanych przez aplikację. W tym artykule opisano sposób konfigurowania dedykowanych obiektów jednostki usługi aplikacji, które mają być używane podczas programowania lokalnego.

A diagram showing how a JavaScript app during local development will use the developer's credentials to connect to Azure by obtaining those credentials locally installed development tools.

Dedykowane jednostki usługi aplikacji na potrzeby tworzenia aplikacji lokalnych umożliwiają przestrzeganie zasady najniższych uprawnień podczas tworzenia aplikacji. Ponieważ uprawnienia są ograniczone do dokładnie tego, co jest potrzebne dla aplikacji podczas programowania, kod aplikacji nie może przypadkowo uzyskać dostępu do zasobu platformy Azure przeznaczonego do użytku przez inną aplikację. Zapobiega to również występowaniu usterek podczas przenoszenia aplikacji do środowiska produkcyjnego, ponieważ aplikacja została nadmiernie uprzywilejowana w środowisku deweloperskim.

Jednostka usługi aplikacji jest skonfigurowana dla aplikacji, gdy aplikacja jest zarejestrowana na platformie Azure. Podczas rejestrowania aplikacji na potrzeby programowania lokalnego zaleca się:

  • Utwórz oddzielne rejestracje aplikacji dla każdego dewelopera pracującego nad aplikacją. Spowoduje to utworzenie oddzielnych jednostek usługi aplikacji dla każdego dewelopera do użycia podczas programowania lokalnego i uniknięcie konieczności przez deweloperów udostępniania poświadczeń dla pojedynczej jednostki usługi aplikacji.
  • Utwórz oddzielne rejestracje aplikacji na aplikację. Obejmuje to uprawnienia aplikacji tylko do tego, co jest potrzebne przez aplikację.

Podczas programowania lokalnego zmienne środowiskowe są ustawiane przy użyciu tożsamości jednostki usługi aplikacji. Zestaw Azure SDK dla języka JavaScript odczytuje te zmienne środowiskowe i używa tych informacji do uwierzytelniania aplikacji w potrzebnych zasobach platformy Azure.

1 — Rejestrowanie aplikacji na platformie Azure

Obiekty jednostki usługi aplikacji są tworzone przy użyciu rejestracji aplikacji na platformie Azure. Można to zrobić przy użyciu witryny Azure Portal lub interfejsu wiersza polecenia platformy Azure.

Zaloguj się do witryny Azure Portal i wykonaj następujące kroki.

Instrukcje Zrzut ekranu
W witrynie Azure Portal:
  1. Wprowadź rejestracje aplikacji na pasku wyszukiwania w górnej części witryny Azure Portal.
  2. Wybierz element z etykietą Rejestracje aplikacji w obszarze nagłówka Usługi w menu wyświetlanym poniżej paska wyszukiwania.
A screenshot showing how to use the top search bar in the Azure portal to find and navigate to the App registrations page.
Na stronie Rejestracje aplikacji wybierz pozycję + Nowa rejestracja. A screenshot showing the location of the New registration button in the App registrations page.
Na stronie Rejestrowanie aplikacji wypełnij formularz w następujący sposób.
  1. Nazwa → wprowadź nazwę rejestracji aplikacji na platformie Azure. Zaleca się, aby ta nazwa zawierała nazwę aplikacji, dla użytkownika, dla których jest rejestracja aplikacji, a identyfikator taki jak "dev", aby wskazać, że ta rejestracja aplikacji jest używana w programowania lokalnego.
  2. Obsługiwane typy kont → Konta tylko w tym katalogu organizacyjnym.
Wybierz pozycję Zarejestruj, aby zarejestrować aplikację i utworzyć jednostkę usługi aplikacji.
A screenshot showing how to fill out the Register an application page by giving the app a name and specifying supported account types as accounts in this organizational directory only.
Na stronie Rejestracja aplikacji dla aplikacji:
  1. Identyfikator aplikacji (klienta) → Jest to identyfikator aplikacji, który będzie używany do uzyskiwania dostępu do platformy Azure podczas programowania lokalnego. Skopiuj tę wartość do lokalizacji tymczasowej w edytorze tekstów, ponieważ będzie ona potrzebna w przyszłym kroku.
  2. Identyfikator katalogu (dzierżawy) → Ta wartość będzie również potrzebna przez aplikację podczas uwierzytelniania na platformie Azure. Skopiuj tę wartość do lokalizacji tymczasowej w edytorze tekstów, która będzie również potrzebna w przyszłym kroku.
  3. Poświadczenia klienta → Należy ustawić poświadczenia klienta dla aplikacji, zanim aplikacja będzie mogła uwierzytelnić się na platformie Azure i korzystać z usług platformy Azure. Wybierz pozycję Dodaj certyfikat lub wpis tajny , aby dodać poświadczenia dla aplikacji.
A screenshot after the app registration has been completed with the location of the application ID, tenant ID.
Na stronie Certyfikaty i wpisy tajne wybierz pozycję + Nowy klucz tajny klienta. A screenshot showing the location of the link to use to create a new client secret on the certificates and secrets page.
W oknie dialogowym Dodawanie wpisu tajnego klienta zostanie wyświetlone okno dialogowe po prawej stronie. W tym oknie dialogowym:
  1. Opis → Wprowadź wartość Current.
  2. Wygasa → wybierz wartość 24 miesięcy.
Wybierz pozycję Dodaj , aby dodać wpis tajny.
A screenshot showing the page where a new client secret is added for the application service principal create by the app registration process.
Na stronie Certyfikaty i wpisy tajne zostanie wyświetlona wartość klucza tajnego klienta.

Skopiuj tę wartość do lokalizacji tymczasowej w edytorze tekstów, ponieważ będzie ona potrzebna w przyszłym kroku.

WAŻNE: jest to jedyna godzina wyświetlenia tej wartości. Po opuszczeniu lub odświeżeniu tej strony nie będzie można ponownie wyświetlić tej wartości. Możesz dodać więcej wpisów tajnych klienta bez unieważnienia tego wpisu tajnego klienta, ale ta wartość nie zostanie ponownie wyświetlona.
A screenshot showing the page with the generated client secret.

2 — Tworzenie grupy zabezpieczeń entra firmy Microsoft na potrzeby programowania lokalnego

Ponieważ zazwyczaj wielu deweloperów, którzy pracują nad aplikacją, zaleca się utworzenie grupy Entra firmy Microsoft w celu hermetyzacji ról (uprawnień) wymaganych przez aplikację w środowisku lokalnym zamiast przypisywania ról do poszczególnych obiektów jednostki usługi. Oferuje to następujące korzyści.

  • Każdy deweloper ma przypisane te same role, ponieważ role są przypisywane na poziomie grupy.
  • Jeśli dla aplikacji jest potrzebna nowa rola, należy ją dodać tylko do grupy Microsoft Entra dla aplikacji.
  • Jeśli nowy deweloper dołączy do zespołu, zostanie utworzona nowa jednostka usługi aplikacji dla dewelopera i dodana do grupy, zapewniając deweloperowi odpowiednie uprawnienia do pracy nad aplikacją.
Instrukcje Zrzut ekranu
Przejdź do strony Microsoft Entra ID w witrynie Azure Portal, wpisując ciąg Microsoft Entra ID w polu wyszukiwania w górnej części strony, a następnie wybierając pozycję Microsoft Entra ID w obszarze usług. A screenshot showing how to use the top search bar in the Azure portal to search for and navigate to the Microsoft Entra ID page.
Na stronie Microsoft Entra ID wybierz pozycję Grupy z menu po lewej stronie. A screenshot showing the location of the Groups menu item in the left-hand menu of the Microsoft Entra ID Default Directory page.
Na stronie Wszystkie grupy wybierz pozycję Nowa grupa. A screenshot showing the location of the New Group button in the All groups page.
Na stronie Nowa grupa:
  1. Typ grupy → Zabezpieczenia
  2. Nazwa grupy → nazwa grupy zabezpieczeń, zazwyczaj utworzona na podstawie nazwy aplikacji. Warto również uwzględnić ciąg, taki jak local-dev w nazwie grupy, aby wskazać cel grupy.
  3. Opis grupy → Opis celu grupy.
  4. Wybierz link Brak wybranych członków w obszarze Członkowie, aby dodać członków do grupy.
A screenshot showing how to create a new Microsoft Entra group for the application.
W oknie dialogowym Dodawanie członków:
  1. Użyj pola wyszukiwania, aby filtrować listę głównych nazw na liście.
  2. Wybierz jednostki usługi aplikacji dla programowania lokalnego dla tej aplikacji. Po wybraniu obiektów będą wyszarzone i przeniesione do listy Wybrane elementy w dolnej części okna dialogowego.
  3. Po zakończeniu wybierz przycisk Wybierz .
A screenshot of the Add members dialog box showing how to select application service principals to be included in the group.
Po powrocie na stronę Nowa grupa wybierz pozycję Utwórz , aby utworzyć grupę.

Grupa zostanie utworzona i nastąpi powrót do strony Wszystkie grupy . Wyświetlenie grupy może potrwać do 30 sekund i może być konieczne odświeżenie strony z powodu buforowania w witrynie Azure Portal.
A screenshot of the New Group page showing how to complete the process by selecting the Create button.

3 — Przypisywanie ról do aplikacji

Następnie należy określić, jakich ról (uprawnień) potrzebuje twoja aplikacja na temat zasobów i przypisać te role do aplikacji. W tym przykładzie role zostaną przypisane do grupy Microsoft Entra utworzonej w kroku 2. Role mogą być przypisywane do roli w zakresie zasobu, grupy zasobów lub subskrypcji. W tym przykładzie pokazano, jak przypisywać role w zakresie grupy zasobów, ponieważ większość aplikacji grupuje wszystkie zasoby platformy Azure w jedną grupę zasobów.

Instrukcje Zrzut ekranu
Znajdź grupę zasobów dla aplikacji, wyszukując nazwę grupy zasobów przy użyciu pola wyszukiwania w górnej części witryny Azure Portal.

Przejdź do grupy zasobów, wybierając nazwę grupy zasobów pod nagłówkiem Grupy zasobów w oknie dialogowym.
A screenshot showing how to use the top search box in the Azure portal to locate and navigate to the resource group you want to assign roles (permissions) to.
Na stronie grupy zasobów wybierz pozycję Kontrola dostępu (Zarządzanie dostępem i tożsamościami) z menu po lewej stronie. A screenshot of the resource group page showing the location of the Access control (IAM) menu item.
Na stronie Kontrola dostępu (Zarządzanie dostępem i tożsamościami):
  1. Wybierz kartę Przypisania roli.
  2. Wybierz pozycję + Dodaj z górnego menu, a następnie pozycję Dodaj przypisanie roli z wyświetlonego menu rozwijanego.
A screenshot showing how to navigate to the role assignments tab and the location of the button used to add role assignments to a resource group.
Strona Dodawanie przypisania roli zawiera listę wszystkich ról, które można przypisać dla grupy zasobów.
  1. Użyj pola wyszukiwania, aby przefiltrować listę do bardziej możliwego do zarządzania rozmiaru. W tym przykładzie pokazano, jak filtrować role obiektów blob usługi Storage.
  2. Wybierz rolę, którą chcesz przypisać.
    Wybierz przycisk Dalej , aby przejść do następnego ekranu.
A screenshot showing how to filter and select role assignments to be added to the resource group.
Następna strona Dodawanie przypisania roli umożliwia określenie, do którego użytkownika ma zostać przypisana rola.
  1. Wybierz pozycję Użytkownik, grupa lub jednostka usługi w obszarze Przypisz dostęp do.
  2. Wybierz pozycję + Wybierz członków w obszarze Członkowie
Zostanie otwarte okno dialogowe po prawej stronie witryny Azure Portal.
A screenshot showing the radio button to select to assign a role to a Microsoft Entra group and the link used to select the group to assign the role to.
W oknie dialogowym Wybieranie członków:
  1. Pole tekstowe Wybierz może służyć do filtrowania listy użytkowników i grup w ramach subskrypcji. W razie potrzeby wpisz kilka pierwszych znaków lokalnej grupy deweloperów firmy Microsoft Entra utworzonej dla aplikacji.
  2. Wybierz lokalną grupę deweloperów firmy Microsoft skojarzona z twoją aplikacją.
Wybierz pozycję Wybierz w dolnej części okna dialogowego, aby kontynuować.
A screenshot showing how to filter for and select the Microsoft Entra group for the application in the Select members dialog box.
Grupa Microsoft Entra będzie teraz wyświetlana jako wybrana na ekranie Dodawanie przypisania roli.

Wybierz pozycję Przejrzyj i przypisz , aby przejść do ostatniej strony, a następnie ponownie przejrzyj i przypisz, aby ukończyć proces.
A screenshot showing the completed Add role assignment page and the location of the Review + assign button used to complete the process.

4 — Ustawianie lokalnych zmiennych środowiskowych programowania

Obiekt DefaultAzureCredential będzie szukać informacji o jednostce usługi w zestawie zmiennych środowiskowych w czasie wykonywania. Ponieważ większość deweloperów pracuje nad wieloma aplikacjami, zaleca się użycie pakietu takiego jak dotenv w celu uzyskania dostępu do środowiska z pliku przechowywanego .env w katalogu aplikacji podczas programowania. Obejmuje to zmienne środowiskowe używane do uwierzytelniania aplikacji na platformie Azure, tak aby mogły być używane tylko przez tę aplikację.

Plik .env nigdy nie jest ewidencjony w kontroli źródła, ponieważ zawiera klucz tajny aplikacji dla platformy Azure. Standardowy plik .gitignore dla języka JavaScript automatycznie wyklucza .env plik z ewidencjonowania.

Aby użyć dotenv pakietu, najpierw zainstaluj pakiet w aplikacji.

npm install dotenv

Następnie utwórz .env plik w katalogu głównym aplikacji. Ustaw wartości zmiennych środowiskowych z wartościami uzyskanymi z procesu rejestracji aplikacji w następujący sposób:

  • AZURE_CLIENT_ID → wartość identyfikatora aplikacji.
  • AZURE_TENANT_ID → wartość identyfikatora dzierżawy.
  • AZURE_CLIENT_SECRET → hasło/poświadczenia wygenerowane dla aplikacji.
AZURE_CLIENT_ID=00000000-0000-0000-0000-000000000000
AZURE_TENANT_ID=11111111-1111-1111-1111-111111111111
AZURE_CLIENT_SECRET=abcdefghijklmnopqrstuvwxyz

Na koniec w kodzie uruchamiania aplikacji użyj dotenv biblioteki, aby odczytać zmienne środowiskowe z pliku podczas uruchamiania .env .

import 'dotenv/config'

5 — Implementowanie wartości domyślnejAzureCredential w aplikacji

Aby uwierzytelnić obiekty klienta zestawu Azure SDK na platformie Azure, aplikacja powinna używać DefaultAzureCredential klasy z @azure/identity pakietu. W tym scenariuszu DefaultAzureCredential program wykryje zmienne środowiskowe AZURE_CLIENT_ID, AZURE_TENANT_IDi AZURE_CLIENT_SECRET zostanie ustawiony i odczytuje te zmienne, aby uzyskać informacje o jednostce usługi aplikacji w celu nawiązania połączenia z platformą Azure za pomocą polecenia .

Zacznij od dodania pakietu @azure/tożsamości do aplikacji.

npm install @azure/identity

Następnie w przypadku dowolnego kodu JavaScript, który tworzy obiekt klienta zestawu Azure SDK w aplikacji, należy wykonać następujące czynności:

  1. Zaimportuj klasę DefaultAzureCredential z modułu @azure/identity .
  2. Utwórz DefaultAzureCredential obiekt.
  3. Przekaż obiekt do konstruktora DefaultAzureCredential obiektu klienta zestawu Azure SDK.

Przykład jest pokazany w następującym segmencie kodu.

// 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/123456',
          subscriptionId: '123456',
          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 Automatycznie wykryje mechanizm uwierzytelniania skonfigurowany dla aplikacji i uzyska niezbędne tokeny do uwierzytelniania aplikacji na platformie Azure. Jeśli aplikacja korzysta z więcej niż jednego klienta zestawu SDK, ten sam obiekt poświadczeń może być używany z każdym obiektem klienta zestawu SDK.