Übung: Einrichten Ihrer Umgebung

  • 4 Minuten

Wichtig

Sie benötigen für diese Übung ein eigenes Azure-Abonnement. Außerdem fallen möglicherweise Gebühren für Sie an. Wenn Sie noch kein Azure-Abonnement besitzen, können Sie ein kostenloses Konto erstellen, bevor Sie beginnen.

Bevor Sie mit der Arbeit am Websiteworkflow Ihres Spielzeugunternehmens beginnen, müssen Sie Ihre Umgebung konfigurieren. In diesem Abschnitt stellen Sie sicher, dass Ihre Azure- und GitHub-Umgebungen so eingerichtet sind, dass Sie den Rest dieses Moduls absolvieren können.

Um diese Ziele zu erreichen, führen Sie die folgenden Aufgaben aus:

  • Richten Sie ein GitHub-Repository für dieses Modul ein.
  • Klonen Sie das Repository auf Ihrem Computer.
  • Erstellen Sie eine Ressourcengruppe in Azure.
  • Erstellen Sie ein Geheimnis in GitHub.

Abrufen des GitHub-Repositorys

Richten Sie Ihr GitHub-Repository ein, um den Rest dieses Moduls abzuschließen, indem Sie ein neues Repository basierend auf einem Vorlagen-Repository erstellen. Das Vorlagenrepository enthält die Dateien, die Sie für den Einstieg in dieses Modul benötigen.

Die Module in diesem Lernpfad sind fortschreitend angeordnet. Zu Lernzwecken verfügt jedes Modul über ein zugeordnetes GitHub Vorlagenrepository.

Tipp

Auch wenn Sie das vorherige Modul im Lernpfad abgeschlossen haben, befolgen Sie diese Anweisungen, um ein neues Repository zu erstellen. Stellen Sie dabei sicher, dass Sie ihm einen neuen Namen geben.

Starten über das Vorlagenrepository

Führen Sie eine Vorlage aus, mit der Ihr GitHub-Repository eingerichtet wird.

Ausführen der Vorlage

Führen Sie auf GitHub-Website die folgenden Schritte aus, um ein Repository aus der Vorlage zu erstellen:

  1. Wählen Sie Diese Vorlage verwenden>Neues Repository erstellen aus.

    Screenshot der GitHub-Benutzeroberfläche mit dem Vorlagenrepository und hervorgehobener Schaltfläche „Use this template“ (Diese Vorlage verwenden)

  2. Wählen Sie in der Dropdownliste Besitzer Ihren GitHub-Benutzernamen aus.

  3. Geben Sie einen Repositorynamen für Ihr neues Projekt ein (z. B. toy-website-test).

  4. Wählen Sie die Option Public aus.

    Wenn Sie Ihre eigenen Repositorys erstellen, können Sie diese als privat festlegen. Dieses Modul verwendet jedoch einige Features von GitHub, die nur mit öffentlichen Repositorys und mit GitHub Enterprise-Konten funktionieren.

  5. Klicken Sie auf Create repository (Repository erstellen).

    Screenshot der GitHub-Benutzeroberfläche mit der Seite zur Repositoryerstellung

Wichtig

Die letzte Übung in diesem Modul enthält wichtige Schritte zur Bereinigung. Führen Sie unbedingt die Bereinigungsschritte durch, auch wenn Sie dieses Modul nicht absolvieren.

Klonen des Repositorys

Sie verfügen nun über eine Kopie des Vorlagenrepositorys in Ihrem eigenen Konto. Klonen Sie dieses Repository lokal, damit Sie damit arbeiten können.

  1. Wählen Sie Code und dann das Kopiersymbol aus.

    Screenshot der GitHub-Benutzeroberfläche mit dem neuen Repository und hervorgehobener Schaltfläche zum Kopieren der Repository-URL

  2. Öffnen Sie Visual Studio Code.

  3. Öffnen Sie in Visual Studio Code ein neues Terminalfenster, indem Sie auf Terminal>ansehen klicken. Das Fenster wird in der Regel am unteren Bildschirmrand geöffnet.

  4. Navigieren Sie im Terminal zu dem Verzeichnis, in dem Sie das GitHub-Repository auf Ihrem lokalen Computer klonen möchten.

  5. Geben Sie git clone ein, und fügen Sie die zuvor kopierte URL ein. Das Ergebnis sollte in etwa wie folgt aussehen:

    git clone https://github.com/mygithubuser/toy-website-test.git

  6. Öffnen Sie Visual Studio Code erneut im Repositoryordner, indem Sie den folgenden Befehl am Visual Studio Code-Terminal ausführen:

    code -r toy-website-test

Anmelden bei Azure

Sie müssen sich über das Visual Studio Code-Terminal bei Ihrem Azure-Konto anmelden, um Ressourcengruppen in Azure verwenden zu können. Stellen Sie sicher, dass Sie die Azure CLI-Tools installiert haben.

  1. Wählen Sie im Menü Terminal die Option New Terminal (Neues Terminal) aus. Das Terminalfenster wird in der Regel in der unteren Hälfte des Bildschirms geöffnet.

    Die Standardshell ist in der Regel pwsh, wie auf der rechten Seite des Terminalfensters dargestellt.

    Screenshot des Visual Studio Code-Terminalfensters, in dem pwsh als Shelloption angezeigt wird.

  2. Wählen Sie die Dropdownliste Startprofil und dann Azure Cloud Shell (Bash) aus.

    Screenshot des Visual Studio Code-Terminalfensters. Die Dropdownliste der Terminalshell und das Menüelement Azure Cloud Shell (Bash) werden angezeigt.

    Eine neue Shell wird geöffnet.

Anmelden bei Azure über die Azure CLI

  1. Führen Sie im Visual Studio Code-Terminal den folgenden Befehl aus, um sich bei Azure anzumelden:

    az login

  2. Melden Sie sich im Browserfenster, das daraufhin geöffnet wird, in Ihrem Azure-Konto an.

Sie müssen sich über das Visual Studio Code-Terminal bei Ihrem Azure-Konto anmelden, um Ressourcengruppen in Azure verwenden zu können. Stellen Sie sicher, dass Azure PowerShell installiert ist.

  1. Wählen Sie im Menü Terminal die Option New Terminal (Neues Terminal) aus. Das Terminalfenster wird in der Regel in der unteren Hälfte des Bildschirms geöffnet.

    Die Standardshell ist in der Regel pwsh, wie auf der rechten Seite des Terminalfensters dargestellt.

    Screenshot des Visual Studio Code-Terminalfensters, in dem pwsh als Shelloption angezeigt wird.

  2. Wählen Sie die Dropdownliste Startprofil und dann Azure Cloud Shell (PowerShell) aus.

    Screenshot des Visual Studio Code-Terminalfensters. Die Dropdownliste der Terminalshell und das Menüelement Azure Cloud Shell (PowerShell) werden angezeigt.

    Eine neue Shell wird geöffnet.

Anmelden bei Azure mithilfe von Azure PowerShell

  1. Führen Sie im Visual Studio Code-Terminal den folgenden Befehl aus, um sich bei Azure anzumelden:

    Connect-AzAccount

  2. Melden Sie sich im Browserfenster, das daraufhin geöffnet wird, in Ihrem Azure-Konto an.

Erstellen einer Workloadidentität

Als Nächstes erstellen Sie in Microsoft Entra ID eine Workloadidentität für Ihren Bereitstellungsworkflow.

Zum Erstellen der Workloadidentität verwenden die Azure CLI-Befehle jq, um Daten aus der JSON-Ausgabe zu parsen. Wenn Sie jq nicht installiert haben, können Sie Bash in Azure Cloud Shell verwenden, um die Workloadidentität, die Ressourcengruppe und die Rollenzuweisung zu erstellen und die GitHub-Geheimnisse vorzubereiten.

  1. Führen Sie den folgenden Code aus, um Variablen für Ihren GitHub-Benutzernamen und den Namen Ihres Repositorys zu definieren. Stellen Sie sicher, dass Sie <myGithubUser> durch Ihren GitHub-Benutzernamen ersetzen, den Sie zuvor in dieser Übung notiert haben. Stellen Sie außerdem sicher, dass Sie den richtigen GitHub-Repositorynamen angeben.

    githubOrganizationName='<myGithubUser>'
githubRepositoryName='toy-website-test'

  2. Erstellen Sie eine Workloadidentität für Ihren Bereitstellungsworkflow. Sie erstellen zwei Verbundanmeldeinformationen, um sich auf eine spätere Übung in diesem Modul vorzubereiten.

    applicationRegistrationDetails=$(az ad app create --display-name 'toy-website-test')
applicationRegistrationObjectId=$(echo $applicationRegistrationDetails | jq -r '.id')
applicationRegistrationAppId=$(echo $applicationRegistrationDetails | jq -r '.appId')

az ad app federated-credential create \
   --id $applicationRegistrationObjectId \
   --parameters "{\"name\":\"toy-website-test\",\"issuer\":\"https://token.actions.githubusercontent.com\",\"subject\":\"repo:${githubOrganizationName}/${githubRepositoryName}:environment:Website\",\"audiences\":[\"api://AzureADTokenExchange\"]}"

az ad app federated-credential create \
   --id $applicationRegistrationObjectId \
   --parameters "{\"name\":\"toy-website-test-branch\",\"issuer\":\"https://token.actions.githubusercontent.com\",\"subject\":\"repo:${githubOrganizationName}/${githubRepositoryName}:ref:refs/heads/main\",\"audiences\":[\"api://AzureADTokenExchange\"]}"

  1. Führen Sie den folgenden Code aus, um Variablen für Ihren GitHub-Benutzernamen und den Namen Ihres Repositorys zu definieren. Stellen Sie sicher, dass Sie <myGithubUser> durch Ihren GitHub-Benutzernamen ersetzen, den Sie zuvor in dieser Übung notiert haben. Stellen Sie außerdem sicher, dass Sie den richtigen GitHub-Repositorynamen angeben.

    $githubOrganizationName = '<myGithubUser>'
$githubRepositoryName = 'toy-website-test'

  2. Erstellen Sie eine Workloadidentität für Ihren Bereitstellungsworkflow. Sie erstellen zwei Verbundanmeldeinformationen, um sich auf eine spätere Übung in diesem Modul vorzubereiten.

    $applicationRegistration = New-AzADApplication -DisplayName 'toy-website-test'
New-AzADAppFederatedCredential `
   -Name 'toy-website-test' `
   -ApplicationObjectId $applicationRegistration.Id `
   -Issuer 'https://token.actions.githubusercontent.com' `
   -Audience 'api://AzureADTokenExchange' `
   -Subject "repo:$($githubOrganizationName)/$($githubRepositoryName):environment:Website"

New-AzADAppFederatedCredential `
   -Name 'toy-website-test-branch' `
   -ApplicationObjectId $applicationRegistration.Id `
   -Issuer 'https://token.actions.githubusercontent.com' `
   -Audience 'api://AzureADTokenExchange' `
   -Subject "repo:$($githubOrganizationName)/$($githubRepositoryName):ref:refs/heads/main"

Erstellen einer Ressourcengruppe in Azure und Erteilen von Zugriff für die Workloadidentität

Als Nächstes erstellen Sie eine Ressourcengruppe für Ihre Website. Dadurch wird der Workloadidentität auch die Rolle „Mitwirkender“ für die Ressourcengruppe gewährt, damit Ihr Workflow eine Bereitstellung in der Ressourcengruppe durchführen kann.

Führen Sie im Visual Studio Code-Terminal die folgenden Azure CLI-Befehle aus:

resourceGroupResourceId=$(az group create --name ToyWebsiteTest --location westus3 --query id --output tsv)

az ad sp create --id $applicationRegistrationObjectId
az role assignment create \
  --assignee $applicationRegistrationAppId \
  --role Contributor \
  --scope $resourceGroupResourceId

Führen Sie im Visual Studio Code-Terminal die folgenden Azure PowerShell-Befehle aus:

$resourceGroup = New-AzResourceGroup -Name ToyWebsiteTest -Location westus3

New-AzADServicePrincipal -AppId $($applicationRegistration.AppId)
New-AzRoleAssignment `
  -ApplicationId $($applicationRegistration.AppId) `
  -RoleDefinitionName Contributor `
  -Scope $($resourceGroup.ResourceId)

Vorbereiten von GitHub-Geheimnissen

Führen Sie den folgenden Code aus, um die Werte anzuzeigen, die Sie als GitHub-Geheimnisse erstellen müssen:

echo "AZURE_CLIENT_ID: $applicationRegistrationAppId"
echo "AZURE_TENANT_ID: $(az account show --query tenantId --output tsv)"
echo "AZURE_SUBSCRIPTION_ID: $(az account show --query id --output tsv)"

$azureContext = Get-AzContext
Write-Host "AZURE_CLIENT_ID: $($applicationRegistration.AppId)"
Write-Host "AZURE_TENANT_ID: $($azureContext.Tenant.Id)"
Write-Host "AZURE_SUBSCRIPTION_ID: $($azureContext.Subscription.Id)"

Erstellen von GitHub-Geheimnissen

Sie haben eine Workloadidentität und eine Ressourcengruppe erstellt, in der eine Bereitstellung erfolgen kann. Als Nächstes erstellen Sie Geheimnisse in GitHub Actions.

  1. Navigieren Sie im Browser zu Ihrem GitHub-Repository.

  2. Wählen Sie Einstellungen>Geheimnisse und Variablen>Aktionen aus.

  3. Wählen Sie New repository secret (Neues Repositorygeheimnis) aus.

    Screenshot der GitHub-Benutzeroberfläche mit der Seite „Geheimnisse“ mit hervorgehobener Schaltfläche „New repository secret“ (Neues Repositorygeheimnis)

  4. Nennen Sie das Geheimnis AZURE_CLIENT_ID.

  5. Fügen Sie in das Feld Wert die GUID aus der ersten Zeile der Terminalausgabe ein. Fügen Sie AZURE_CLIENT_ID, den Doppelpunkt und Leerzeichen nicht in den Wert ein.

  6. Klicken Sie auf Add secret (Geheimnis hinzufügen).

    Screenshot der GitHub-Benutzeroberfläche mit der Seite „New Secret“ (Neues Geheimnis) mit ausgefülltem Namen und Wert und hervorgehobener Schaltfläche „Add secret“ (Geheimnis hinzufügen)

  7. Wiederholen Sie den Vorgang, um die Geheimnisse für AZURE_TENANT_ID und AZURE_SUBSCRIPTION_ID zu erstellen, indem Sie die Werte aus den entsprechenden Feldern der Terminalausgabe kopieren.

  8. Vergewissern Sie sich, dass in der Liste der Geheimnisse jetzt alle drei Geheimnisse angezeigt werden.

    Screenshot: GitHub-Benutzeroberfläche mit der Liste der Geheimnisse