Autentisera JavaScript-appar till Azure-tjänster under lokal utveckling med hjälp av tjänstens huvudnamn

  • Artikel

När du skapar molnprogram måste utvecklare felsöka och testa program på sin lokala arbetsstation. När ett program körs på en utvecklares arbetsstation under den lokala utvecklingen måste det fortfarande autentiseras mot alla Azure-tjänster som används av appen. Den här artikeln beskriver hur du konfigurerar dedikerade programtjänstobjekt som ska användas under lokal utveckling.

Ett diagram som visar hur en JavaScript-app under lokal utveckling använder utvecklarens autentiseringsuppgifter för att ansluta till Azure genom att hämta dessa autentiseringsuppgifter lokalt installerade utvecklingsverktyg.

Med dedikerade huvudnamn för programtjänsten för lokal utveckling kan du följa principen om lägsta behörighet under apputveckling. Eftersom behörigheter är begränsade till exakt vad som behövs för appen under utvecklingen förhindras appkod från att oavsiktligt komma åt en Azure-resurs som är avsedd att användas av en annan app. Den här metoden förhindrar också att buggar inträffar när appen flyttas till produktion eftersom appen överprivilegierats i utvecklingsmiljön.

Ett huvudnamn för programtjänsten konfigureras för appen när appen är registrerad i Azure. När du registrerar appar för lokal utveckling rekommenderar vi att du:

  • Skapa separata appregistreringar för varje utvecklare som arbetar med appen. Den här metoden skapar separata huvudnamn för programtjänsten som varje utvecklare kan använda under lokal utveckling och undviker behovet av att utvecklare delar autentiseringsuppgifter för ett enda huvudnamn för programtjänsten.
  • Skapa separata appregistreringar per app. Detta omfattar endast appens behörigheter till det som behövs av appen.

Under lokal utveckling anges miljövariabler med programtjänstens huvudnamns identitet. Azure SDK för JavaScript läser dessa miljövariabler och använder den här informationen för att autentisera appen till de Azure-resurser den behöver.

1 – Registrera programmet i Azure

Huvudobjekt för programtjänsten skapas med en appregistrering i Azure. Du kan skapa tjänstens huvudnamn med hjälp av antingen Azure-portalen eller Azure CLI.

Logga in på Azure-portalen och följ dessa steg.

Instruktioner Skärmbild
I Azure-portalen:
  1. Ange appregistreringar i sökfältet överst i Azure-portalen.
  2. Välj det objekt som är märkt Appregistreringar under rubriken Tjänster på menyn som visas under sökfältet.
 En skärmbild som visar hur du använder det översta sökfältet i Azure-portalen för att hitta och navigera till Appregistreringar sidan.
På sidan Appregistreringar väljer du + Ny registrering. En skärmbild som visar platsen för knappen Ny registrering på sidan Appregistreringar.
På sidan Registrera ett program fyller du i formuläret på följande sätt.
  1. Namn → Ange ett namn för appregistreringen i Azure. Det rekommenderas att det här namnet inkluderar appnamnet, den användare som appregistreringen är för och en identifierare som "dev" som anger att den här appregistreringen ska användas i lokal utveckling.
  2. Kontotyper som stöds → endast konton i den här organisationskatalogen.
Välj Registrera för att registrera din app och skapa programtjänstens huvudnamn.		 En skärmbild som visar hur du fyller i sidan Registrera ett program genom att ge appen ett namn och ange kontotyper som stöds som endast konton i den här organisationskatalogen.
På sidan Appregistrering för din app:
  1. Program-ID → Det här är det app-ID som appen använder för att komma åt Azure under den lokala utvecklingen. Kopiera det här värdet till en tillfällig plats i en textredigerare eftersom du behöver det i ett framtida steg.
  2. Katalog-ID → Det här värdet behövs också av din app när den autentiseras till Azure. Kopiera det här värdet till en tillfällig plats i en textredigerare. Det behövs också i ett framtida steg.
  3. Klientautentiseringsuppgifter → Du måste ange klientautentiseringsuppgifterna för appen innan appen kan autentisera till Azure och använda Azure-tjänster. Välj Lägg till ett certifikat eller en hemlighet för att lägga till autentiseringsuppgifter för din app.
 En skärmbild efter att appregistreringen har slutförts med platsen för program-ID: t, klientorganisations-ID: t.
På sidan Certifikat och hemligheter väljer du + Ny klienthemlighet. En skärmbild som visar platsen för länken som ska användas för att skapa en ny klienthemlighet på sidan certifikat och hemligheter.
Dialogrutan Lägg till en klienthemlighet visas till höger på sidan. I den här dialogrutan:
  1. Beskrivning → Ange värdet Aktuell.
  2. Upphör → Välj ett värde på 24 månader.
Välj Lägg till för att lägga till hemligheten.		 En skärmbild som visar sidan där en ny klienthemlighet läggs till för programtjänstens huvudnamn som skapas av appregistreringsprocessen.
På sidan Certifikat och hemligheter visas värdet för klienthemligheten.

Kopiera det här värdet till en tillfällig plats i en textredigerare eftersom du behöver det i ett framtida steg.

VIKTIGT! Det här är den enda gången du ser det här värdet. När du lämnar eller uppdaterar den här sidan kan du inte se det här värdet igen. Du kan lägga till fler klienthemligheter utan att ogiltigförklara den här klienthemligheten, men det här värdet visas inte igen.		 En skärmbild som visar sidan med den genererade klienthemligheten.

2 – Skapa en Microsoft Entra-säkerhetsgrupp för lokal utveckling

Eftersom det vanligtvis finns flera utvecklare som arbetar med ett program rekommenderar vi att du skapar en Microsoft Entra-grupp för att kapsla in de roller (behörigheter) som appen behöver i lokal utveckling i stället för att tilldela rollerna till enskilda objekt för tjänstens huvudnamn. Detta ger följande fördelar.

  • Varje utvecklare är säker på att ha samma roller tilldelade eftersom roller tilldelas på gruppnivå.
  • Om en ny roll behövs för appen behöver den bara läggas till i Microsoft Entra-gruppen för appen.
  • Om en ny utvecklare ansluter till teamet skapas ett nytt huvudnamn för programtjänsten för utvecklaren och läggs till i gruppen, vilket säkerställer att utvecklaren har rätt behörighet att arbeta med appen.
Instruktioner Skärmbild
Gå till Sidan Microsoft Entra-ID i Azure-portalen genom att skriva Microsoft Entra-ID i sökrutan överst på sidan och sedan välja Microsoft Entra-ID under tjänster. En skärmbild som visar hur du använder det översta sökfältet i Azure-portalen för att söka efter och navigera till sidan Microsoft Entra-ID.
På sidan Microsoft Entra-ID väljer du Grupper på den vänstra menyn. En skärmbild som visar platsen för menyalternativet Grupper i den vänstra menyn på sidan Standardkatalog för Microsoft Entra-ID.
På sidan Alla grupper väljer du Ny grupp. En skärmbild som visar platsen för knappen Ny grupp på sidan Alla grupper.
På sidan Ny grupp :
  1. Grupptyp → Säkerhet
  2. Gruppnamn → Ett namn för säkerhetsgruppen, som vanligtvis skapas från programnamnet. Det är också bra att inkludera en sträng som local-dev i namnet på gruppen för att ange syftet med gruppen.
  3. Gruppbeskrivning → En beskrivning av syftet med gruppen.
  4. Välj länken Inga medlemmar har valts under Medlemmar för att lägga till medlemmar i gruppen.
 En skärmbild som visar hur du skapar en ny Microsoft Entra-grupp för programmet.
I dialogrutan Lägg till medlemmar:
  1. Använd sökrutan för att filtrera listan med huvudnamn i listan.
  2. Välj programtjänstens huvudnamn för lokal utveckling för den här appen. När objekt markeras blir de nedtonade och flyttas till listan Markerade objekt längst ned i dialogrutan.
  3. När du är klar väljer du knappen Välj .
 En skärmbild av dialogrutan Lägg till medlemmar som visar hur du väljer huvudnamn för programtjänsten som ska ingå i gruppen.
På sidan Ny grupp väljer du Skapa för att skapa gruppen.

Gruppen skapas och du kommer tillbaka till sidan Alla grupper . Det kan ta upp till 30 sekunder innan gruppen visas och du kan behöva uppdatera sidan på grund av cachelagring i Azure-portalen.		 En skärmbild av sidan Ny grupp som visar hur du slutför processen genom att välja knappen Skapa.

3 – Tilldela roller till programmet

Därefter måste du bestämma vilka roller (behörigheter) din app behöver på vilka resurser och tilldela dessa roller till din app. I det här exemplet tilldelas rollerna till den Microsoft Entra-grupp som skapades i steg 2. Roller kan tilldelas en roll i ett resurs-, resursgrupps- eller prenumerationsomfång. Det här exemplet visar hur du tilldelar roller i resursgruppens omfång eftersom de flesta program grupperar alla sina Azure-resurser i en enda resursgrupp.

Instruktioner Skärmbild
Leta upp resursgruppen för ditt program genom att söka efter resursgruppens namn med hjälp av sökrutan överst i Azure-portalen.

Gå till resursgruppen genom att välja resursgruppens namn under rubriken Resursgrupper i dialogrutan.		 En skärmbild som visar hur du använder den översta sökrutan i Azure-portalen för att hitta och navigera till den resursgrupp som du vill tilldela roller (behörigheter) till.
På sidan för resursgruppen väljer du Åtkomstkontroll (IAM) på den vänstra menyn. En skärmbild av resursgruppssidan som visar platsen för menyalternativet Åtkomstkontroll (IAM).
På sidan Åtkomstkontroll (IAM):
  1. Välj fliken Rolltilldelningar.
  2. Välj + Lägg till på den översta menyn och sedan Lägg till rolltilldelning från den resulterande nedrullningsbara menyn.
 En skärmbild som visar hur du navigerar till fliken rolltilldelningar och platsen för knappen som används för att lägga till rolltilldelningar i en resursgrupp.
På sidan Lägg till rolltilldelning visas alla roller som kan tilldelas för resursgruppen.
  1. Använd sökrutan för att filtrera listan till en mer hanterbar storlek. Det här exemplet visar hur du filtrerar efter Storage Blob-roller.
  2. Välj den roll du vill tilldela.
    Välj Nästa för att gå till nästa skärm.
 En skärmbild som visar hur du filtrerar och väljer rolltilldelningar som ska läggas till i resursgruppen.
På nästa sida För att lägga till rolltilldelning kan du ange vilken användare som ska tilldela rollen till.
  1. Välj Användare, grupp eller tjänstens huvudnamn under Tilldela åtkomst till.
  2. Välj + Välj medlemmar under Medlemmar
En dialogruta öppnas till höger i Azure-portalen.		 En skärmbild som visar alternativknappen för att välja för att tilldela en roll till en Microsoft Entra-grupp och länken som används för att välja den grupp som rollen ska tilldelas till.
I dialogrutan Välj medlemmar:
  1. Textrutan Välj kan användas för att filtrera listan över användare och grupper i din prenumeration. Om det behövs skriver du de första tecknen i microsoft entra-gruppen för lokal utveckling som du skapade för appen.
  2. Välj den microsoft entra-grupp för lokal utveckling som är associerad med ditt program.
Välj Välj längst ned i dialogrutan för att fortsätta.		 En skärmbild som visar hur du filtrerar efter och väljer Microsoft Entra-gruppen för programmet i dialogrutan Välj medlemmar.
Microsoft Entra-gruppen visas som markerad på skärmen Lägg till rolltilldelning .

Välj Granska + tilldela för att gå till den sista sidan och sedan Granska + tilldela igen för att slutföra processen.		 En skärmbild som visar sidan Lägg till rolltilldelning och platsen för knappen Granska + tilldela som används för att slutföra processen.

4 – Ange miljövariabler för lokal utveckling

Objektet DefaultAzureCredential söker efter informationen om tjänstens huvudnamn i en uppsättning miljövariabler vid körning. Eftersom de flesta utvecklare arbetar med flera program rekommenderar vi att du använder ett paket som dotenv för att komma åt miljön från en .env fil som lagras i programmets katalog under utvecklingen. Detta omfattar de miljövariabler som används för att autentisera programmet till Azure så att de bara kan användas av det här programmet.

Filen .env checkas aldrig in i källkontrollen eftersom den innehåller programhemlighetsnyckeln för Azure. Standardfilen .gitignore för JavaScript undantar .env automatiskt filen från incheckningen.

Om du vill använda dotenv paketet installerar du först paketet i ditt program.

npm install dotenv

Skapa sedan en .env fil i programmets rotkatalog. Ange miljövariabelvärdena med värden som hämtats från appregistreringsprocessen enligt följande:

  • AZURE_CLIENT_ID → App-ID-värdet.
  • AZURE_TENANT_ID → Klientorganisations-ID-värdet.
  • AZURE_CLIENT_SECRET → Lösenordet/autentiseringsuppgifterna som genereras för appen.
AZURE_CLIENT_ID=00000000-0000-0000-0000-000000000000
AZURE_TENANT_ID=11111111-1111-1111-1111-111111111111
AZURE_CLIENT_SECRET=abcdefghijklmnopqrstuvwxyz

I startkoden för ditt program använder dotenv du slutligen biblioteket för att läsa miljövariablerna från filen vid .env start.

import 'dotenv/config'

5 – Implementera DefaultAzureCredential i ditt program

Om du vill autentisera DefaultAzureCredential Azure SDK-klientobjekt till Azure bör ditt program använda klassen från @azure/identity paketet. I det här scenariot DefaultAzureCredential identifierar miljövariablerna AZURE_CLIENT_ID, AZURE_TENANT_IDoch AZURE_CLIENT_SECRET anges och läser dessa variabler för att hämta programtjänstens huvudnamnsinformation för att ansluta till Azure med.

Börja med att lägga till @azure/identitetspaketet i ditt program.

npm install @azure/identity

För alla JavaScript-kod som skapar ett Azure SDK-klientobjekt i din app vill du sedan:

  1. DefaultAzureCredential Importera klassen från modulen@azure/identity.
  2. Skapa ett DefaultAzureCredential objekt.
  3. Skicka objektet DefaultAzureCredential till Azure SDK-klientobjektkonstruktorn.

Ett exempel på detta visas i följande kodsegment.

// 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 identifierar automatiskt den autentiseringsmekanism som konfigurerats för appen och hämtar nödvändiga token för att autentisera appen till Azure. Om ett program använder mer än en SDK-klient kan samma autentiseringsobjekt användas med varje SDK-klientobjekt.