Tutoriel : Créer un pipeline multi-étapes avec Azure DevOps

Azure DevOps Services | Azure DevOps Server 2022 | Azure DevOps Server 2019

Vous pouvez utiliser un pipeline Azure DevOps multi-étapes pour diviser votre processus CI/CD en étapes qui représentent différentes parties de votre cycle de développement. L’utilisation d’un pipeline multi-étapes vous offre une visibilité accrue sur votre processus de déploiement et facilite l’intégration des Approbations et contrôles.

Dans cet article, vous allez créer deux instances App Service et générer un pipeline YAML en trois étapes :

Dans un scénario réel, vous pouvez avoir une autre étape de déploiement en production en fonction de votre processus DevOps.

L’exemple de code de cet exercice concerne une application web .NET pour une simulation de jeu dans l’espace qui inclut un leaderboard pour afficher les meilleurs scores. Vous allez déployer sur des instances de développement et de préproduction Azure Web App pour Linux.

Prérequis

Dupliquer (fork) le projet

Dupliquer l’exemple de référentiel suivant sur GitHub.

https://github.com/MicrosoftDocs/mslearn-tailspin-spacegame-web-deploy

Créer les instances Azure App Service

Avant de pouvoir déployer votre pipeline, vous devez d’abord créer une instance App Service sur laquelle effectuer le déploiement. Vous allez utiliser Azure CLI pour créer l’instance.

  1. Connectez-vous au portail Azure.

  2. Dans le menu, sélectionnez Cloud Shell et l’expérience Bash.

  3. Générez un nombre aléatoire qui rend le nom de domaine de votre application web unique. L’avantage d’une valeur unique est que votre instance App Service n’aura pas de conflit de noms avec d’autres apprenants suivant ce didacticiel.

    webappsuffix=$RANDOM    
    
  4. Ouvrez une invite de commandes et utilisez une commande az group create pour créer un groupe de ressources nommé tailspin-space-game-rg qui contient toutes vos instances App Service. Mettez à jour la valeur de location pour utiliser votre région la plus proche.

    az group create --location eastus --name tailspin-space-game-rg
    
  5. Utilisez l’invite de commandes pour créer un plan App Service.

    az appservice plan create \
      --name tailspin-space-game-asp \
      --resource-group tailspin-space-game-rg \
      --sku B1 \
      --is-linux
    
  6. Dans l’invite de commandes, créez deux instances App Service, une pour chaque instance (développement et préproduction) avec la commande az webapp create.

    az webapp create \
      --name tailspin-space-game-web-dev-$webappsuffix \
      --resource-group tailspin-space-game-rg \
      --plan tailspin-space-game-asp \
      --runtime "DOTNET|6.0"
    
    az webapp create \
      --name tailspin-space-game-web-staging-$webappsuffix \
      --resource-group tailspin-space-game-rg \
      --plan tailspin-space-game-asp \
      --runtime "DOTNET|6.0"
    
  7. Avec l’invite de commandes, affichez les deux instances App Service pour vérifier qu’elles s’exécutent à l’aide de la commande az webapp list.

    az webapp list \
      --resource-group tailspin-space-game-rg \
      --query "[].{hostName: defaultHostName, state: state}" \
      --output table
    
  8. Copiez les noms des instances App Service pour les utiliser comme variables dans la section suivante.

Créer votre projet et vos variables Azure DevOps

Configurez votre projet Azure DevOps et un pipeline de build. Vous allez également ajouter des variables pour vos instances de développement et de préproduction.

Votre pipeline de build :

  • Inclut un déclencheur qui s’exécute en cas de modification du code de la branche
  • Définit deux variables, buildConfiguration et releaseBranchName
  • Inclut une étape nommée Build qui génère l’application web
  • Publie un artefact que vous utiliserez ultérieurement

Ajouter l’étape de génération

  1. Connectez-vous à votre organisation Azure DevOps et accédez à votre projet.

  2. Accédez à Pipelines, puis sélectionnez Nouveau pipeline ou Création d’un pipeline si vous créez votre premier pipeline.

  3. Effectuez les étapes de l’Assistant en sélectionnant d’abord GitHub comme emplacement du code source.

  4. Vous serez peut-être redirigé vers GitHub pour vous connecter. Si c’est le cas, entrez vos informations d’identification GitHub.

  5. Quand la liste des dépôts s’affiche, sélectionnez le vôtre.

  6. Vous serez peut-être redirigé vers GitHub pour pouvoir installer l’application Azure Pipelines. Si c’est le cas, sélectionnez Approuver et installer.

  1. Lorsque l’onglet Configurer s’affiche, sélectionnez Pipeline de démarrage.

  2. Remplacez le contenu d’azure-pipelines.yml par ce code.

    trigger:
    - '*'
    
    variables:
      buildConfiguration: 'Release'
      releaseBranchName: 'release'
    
    stages:
    - stage: 'Build'
      displayName: 'Build the web application'
      jobs: 
      - job: 'Build'
        displayName: 'Build job'
        pool:
          vmImage: 'ubuntu-20.04'
          demands:
          - npm
    
        variables:
          wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
          dotnetSdkVersion: '6.x'
    
        steps:
        - task: UseDotNet@2
          displayName: 'Use .NET SDK $(dotnetSdkVersion)'
          inputs:
            version: '$(dotnetSdkVersion)'
    
        - task: Npm@1
          displayName: 'Run npm install'
          inputs:
            verbose: false
    
        - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
          displayName: 'Compile Sass assets'
    
        - task: gulp@1
          displayName: 'Run gulp tasks'
    
        - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
          displayName: 'Write build info'
          workingDirectory: $(wwwrootDir)
    
        - task: DotNetCoreCLI@2
          displayName: 'Restore project dependencies'
          inputs:
            command: 'restore'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Build the project - $(buildConfiguration)'
          inputs:
            command: 'build'
            arguments: '--no-restore --configuration $(buildConfiguration)'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Publish the project - $(buildConfiguration)'
          inputs:
            command: 'publish'
            projects: '**/*.csproj'
            publishWebProjects: false
            arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
            zipAfterPublish: true
    
        - publish: '$(Build.ArtifactStagingDirectory)'
          artifact: drop
    
  3. Lorsque vous êtes prêt, sélectionnez Enregistrer et exécuter.

Ajouter des variables d’instance

  1. Dans Azure DevOps, accédez àBibliothèque>de pipelines.

  2. Sélectionnez + Groupe de variables.

  3. Sous Propriétés, ajoutez Release pour le nom du groupe de variables.

  4. Créez deux variables pour faire référence à vos noms d’hôtes de développement et de préproduction. Remplacez la valeur 1234 par la valeur adaptée à votre instance.

    Nom de la variable Valeur d'exemple
    WebAppNameDev tailspin-space-game-web-dev-1234
    WebAppNameStaging tailspin-space-game-web-staging-1234
  5. Cliquez sur Enregistrer pour enregistrer vos variables.

Ajouter la phase de développement

Ensuite, vous allez mettre à jour votre pipeline pour promouvoir votre build à l’étape Développement.

  1. Dans Azure Pipelines, accédez à Pipelines>Pipelines.

  2. Sélectionnez Modifier dans le menu contextuel pour modifier votre pipeline.

    Capture d’écran de l’élément de menu Modifier sélectionné.

  3. Mettre à jour azure-pipelines.yml pour inclure une étape de développement. Dans l’étape Développement, votre pipeline :

    • S’exécutera lorsque l’étape Générer réussit en raison d’une condition

    • Téléchargera un artefact à partir de drop

    • Se déploiera sur Azure App Service avec une connexion de service Azure Resource Manager

      trigger:
      - '*'
      
      variables:
        buildConfiguration: 'Release'
        releaseBranchName: 'release'
      
      stages:
      - stage: 'Build'
        displayName: 'Build the web application'
        jobs: 
        - job: 'Build'
          displayName: 'Build job'
          pool:
            vmImage: 'ubuntu-20.04'
            demands:
            - npm
      
          variables:
            wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
            dotnetSdkVersion: '6.x'
      
          steps:
          - task: UseDotNet@2
            displayName: 'Use .NET SDK $(dotnetSdkVersion)'
            inputs:
              version: '$(dotnetSdkVersion)'
      
          - task: Npm@1
            displayName: 'Run npm install'
            inputs:
              verbose: false
      
          - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
            displayName: 'Compile Sass assets'
      
          - task: gulp@1
            displayName: 'Run gulp tasks'
      
          - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
            displayName: 'Write build info'
            workingDirectory: $(wwwrootDir)
      
          - task: DotNetCoreCLI@2
            displayName: 'Restore project dependencies'
            inputs:
              command: 'restore'
              projects: '**/*.csproj'
      
          - task: DotNetCoreCLI@2
            displayName: 'Build the project - $(buildConfiguration)'
            inputs:
              command: 'build'
              arguments: '--no-restore --configuration $(buildConfiguration)'
              projects: '**/*.csproj'
      
          - task: DotNetCoreCLI@2
            displayName: 'Publish the project - $(buildConfiguration)'
            inputs:
              command: 'publish'
              projects: '**/*.csproj'
              publishWebProjects: false
              arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
              zipAfterPublish: true
      
          - publish: '$(Build.ArtifactStagingDirectory)'
            artifact: drop
      
      - stage: 'Dev'
        displayName: 'Deploy to the dev environment'
        dependsOn: Build
        condition:  succeeded()
        jobs:
        - deployment: Deploy
          pool:
            vmImage: 'ubuntu-20.04'
          environment: dev
          variables:
          - group: Release
          strategy:
            runOnce:
              deploy:
                steps:
                - download: current
                  artifact: drop
                - task: AzureWebApp@1
                  displayName: 'Azure App Service Deploy: dev website'
                  inputs:
                    azureSubscription: 'your-subscription'
                    appType: 'webAppLinux'
                    appName: '$(WebAppNameDev)'
                    package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'
      
  4. Modifier la tâche AzureWebApp@1 pour utiliser votre abonnement.

    1. Sélectionnez Paramètres pour la tâche.

      Capture d’écran de l’option Paramètres dans l’éditeur de tâche YAML.

    2. Mettez à jour la your-subscription valeur de l’abonnement Azure pour utiliser votre propre abonnement. Vous devrez peut-être autoriser l’accès dans le cadre de ce processus. Si vous rencontrez un problème d’autorisation de votre ressource dans l’éditeur YAML, une autre approche consiste à créer une connexion de service.

      Capture d’écran de l’élément de menu Abonnement Azure.

    3. Définissez le Type d’application sur Application web sur Linux.

    4. Sélectionnez Ajouter pour mettre à jour la tâche.

  5. Enregistrez et exécutez votre pipeline.

Ajouter la phase de préproduction

Enfin, vous allez promouvoir l’étape Développement vers Préproduction. Contrairement à l’environnement Développement, vous souhaitez avoir plus de contrôle dans l’environnement intermédiaire, vous allez donc ajouter une approbation manuelle.

Créer un environnement intermédiaire

  1. Dans Azure Pipelines, sélectionnez Environnements.

  2. Sélectionnez Nouvel environnement.

  3. Créez un environnement avec le nom préproduction et Ressource défini sur Aucune.

  4. Sur la page de l’environnement intermédiaire sélectionnez Approbations et contrôles.

    Capture d’écran de l’option de menu Approbations et contrôles.

  5. Sélectionnez Approbations.

  6. Dans Approbateurs, sélectionnez Ajouter des utilisateurs et des groupes, puis sélectionnez votre compte.

  7. Dans Instructions destinées aux approbateurs, saisissez Approuver ce changement quand il est prêt pour la préproduction.

  8. Sélectionnez Enregistrer.

Ajouter une nouvelle étape au pipeline

Vous allez ajouter une nouvelle étape Staging au pipeline qui inclut une approbation manuelle.

  1. Modifiez votre fichier de pipeline et ajoutez la section Staging.

    trigger:
    - '*'
    
    variables:
      buildConfiguration: 'Release'
      releaseBranchName: 'release'
    
    stages:
    - stage: 'Build'
      displayName: 'Build the web application'
      jobs: 
      - job: 'Build'
        displayName: 'Build job'
        pool:
          vmImage: 'ubuntu-20.04'
          demands:
          - npm
    
        variables:
          wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
          dotnetSdkVersion: '6.x'
    
        steps:
        - task: UseDotNet@2
          displayName: 'Use .NET SDK $(dotnetSdkVersion)'
          inputs:
            version: '$(dotnetSdkVersion)'
    
        - task: Npm@1
          displayName: 'Run npm install'
          inputs:
            verbose: false
    
        - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
          displayName: 'Compile Sass assets'
    
        - task: gulp@1
          displayName: 'Run gulp tasks'
    
        - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
          displayName: 'Write build info'
          workingDirectory: $(wwwrootDir)
    
        - task: DotNetCoreCLI@2
          displayName: 'Restore project dependencies'
          inputs:
            command: 'restore'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Build the project - $(buildConfiguration)'
          inputs:
            command: 'build'
            arguments: '--no-restore --configuration $(buildConfiguration)'
            projects: '**/*.csproj'
    
        - task: DotNetCoreCLI@2
          displayName: 'Publish the project - $(buildConfiguration)'
          inputs:
            command: 'publish'
            projects: '**/*.csproj'
            publishWebProjects: false
            arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
            zipAfterPublish: true
    
        - publish: '$(Build.ArtifactStagingDirectory)'
          artifact: drop
    
    - stage: 'Dev'
      displayName: 'Deploy to the dev environment'
      dependsOn: Build
      condition:  succeeded()
      jobs:
      - deployment: Deploy
        pool:
          vmImage: 'ubuntu-20.04'
        environment: dev
        variables:
        - group: Release
        strategy:
          runOnce:
            deploy:
              steps:
              - download: current
                artifact: drop
              - task: AzureWebApp@1
                displayName: 'Azure App Service Deploy: dev website'
                inputs:
                  azureSubscription: 'your-subscription'
                  appType: 'webAppLinux'
                  appName: '$(WebAppNameDev)'
                  package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'
    
    - stage: 'Staging'
      displayName: 'Deploy to the staging environment'
      dependsOn: Dev
      jobs:
      - deployment: Deploy
        pool:
          vmImage: 'ubuntu-20.04'
        environment: staging
        variables:
        - group: 'Release'
        strategy:
          runOnce:
            deploy:
              steps:
              - download: current
                artifact: drop
              - task: AzureWebApp@1
                displayName: 'Azure App Service Deploy: staging website'
                inputs:
                  azureSubscription: 'your-subscription'
                  appType: 'webAppLinux'
                  appName: '$(WebAppNameStaging)'
                  package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'
    
  2. Modifiez la tâche AzureWebApp@1 dans l’étape Préproduction pour utiliser votre abonnement.

    1. Sélectionnez Paramètres pour la tâche.

      Capture d’écran de l’option Paramètres dans l’éditeur de tâche YAML.

    2. Mettez à jour la your-subscription valeur de l’abonnement Azure pour utiliser votre propre abonnement. Vous devrez peut-être autoriser l’accès dans le cadre de ce processus.

      Capture d’écran de l’élément de menu Abonnement Azure.

    3. Définissez le Type d’application sur Application web sur Linux.

    4. Sélectionnez Ajouter pour mettre à jour la tâche.

  3. Allez à l’exécution de pipeline. Regardez la build en cours d’exécution. Lorsqu’il atteint Staging, le pipeline attend l’approbation manuelle de la mise en production. Vous recevrez également un e-mail indiquant que vous avez un pipeline en attente d’approbation.

    Capture d’écran de l’attente d’approbation d’un pipeline.

  4. Consultez l’approbation et autorisez l’exécution du pipeline.

    Capture d’écran du contrôle de validation manuelle.

Nettoyer les ressources

Si vous ne souhaitez pas continuer à utiliser cette application, supprimez le groupe de ressources dans le portail Azure et le projet dans Azure DevOps en procédant comme suit :

Pour nettoyer votre groupe de ressources :

  1. Accédez au portail Azure et connectez-vous.

  2. Dans la barre de menus, sélectionnez Cloud Shell. Quand vous y êtes invité, sélectionnez l’expérience Bash.

    Capture d’écran du portail Azure montrant la sélection de l’élément de menu Cloud Shell.

  3. Exécutez la commande az group delete suivante pour supprimer le groupe de ressources que vous avez utilisé, tailspin-space-game-rg.

    az group delete --name tailspin-space-game-rg
    

Pour supprimer votre projet Azure DevOps, y compris le pipeline de build, veuillez consulter Effacer un projet.