Exercício – Implementar o padrão de implantação azul-verde

  • 10 minutos

Em Criar um pipeline de várias fases usando o Azure Pipelines, você criou um pipeline de implantação básico que implanta um aplicativo Web para o Serviço de Aplicativo do Azure nessas fases: Desenvolvimento, Teste e Preparo.

Aqui, você adiciona esse fluxo de trabalho aplicando o padrão de implantação azul-verde durante o Preparo.

Para fazer isso, você deve:

  • Adicionar um slot de implantação à instância do Serviço de Aplicativo que corresponda ao Preparo.
  • Adicionar uma tarefa ao pipeline para trocar os slots de implantação.

Adicionar um slot de implantação

Aqui você adiciona um slot de implantação à instância do Serviço de Aplicativo que corresponda ao Preparo.

Por padrão, cada instância do Serviço de Aplicativo fornece um slot padrão, chamado production. Você implantou no slot production quando configurou o pipeline na seção anterior.

Uma instância do Serviço de Aplicativo pode ter vários slots. Aqui você adiciona um segundo um slot de implantação à instância do Serviço de Aplicativo que corresponda ao Preparo. O slot de implantação é chamado de swap.

Para adicionar o slot:

  1. Acesse o portal do Azure e entre.

  2. No menu, selecione Cloud Shell. Quando solicitado, selecione a experiência Bash.

  3. Execute o comando a seguir para obter o nome da instância do Serviço de Aplicativo que corresponde ao Preparo e para armazenar o resultado em uma variável Bash chamada staging.

    staging=$(az webapp list \
  --resource-group tailspin-space-game-rg \
  --query "[?contains(@.name, 'tailspin-space-game-web-staging')].{name: name}" \
  --output tsv)

    O argumento --query usa JMESPath, que é uma linguagem de consulta para JSON. O argumento seleciona a instância do Serviço de Aplicativo cujo campo name contém "tailspin-space-game-web-staging".

  4. Imprima a variável staging para verificar se você obtém o nome correto.

    echo $staging

    Veja um exemplo da saída:

    tailspin-space-game-web-staging-1234

  5. Execute o comando a seguir para adicionar um slot chamado swap ao seu ambiente de preparo.

    az webapp deployment slot create \
  --name $staging \
  --resource-group tailspin-space-game-rg \
  --slot swap

  6. Execute o comando a seguir para listar o nome do host do slot de implantação.

    az webapp deployment slot list \
    --name $staging \
    --resource-group tailspin-space-game-rg \
    --query [].hostNames \
    --output tsv

    O resultado é semelhante a esta saída:

    tailspin-space-game-web-staging-25391-swap.azurewebsites.net

    Anote esse nome do host para mais tarde.

  7. Como uma etapa opcional, vá para seu site em um navegador. Você verá a home page padrão porque ainda não implantou seu código nesse slot.

    Screenshot of the default home page in Azure App Service.

Por padrão, um slot de implantação pode ser acessado pela Internet. Na prática, você pode configurar uma rede virtual do Azure que coloca o seu slot swap em uma rede que não é roteável da Internet, mas que apenas sua equipe pode acessar. Seu slot production permanecerá acessível pela Internet.

Trocar slots de implantação no Preparo

Aqui, você usa a tarefa AzureAppServiceManage@0 para trocar slots de implantação em seu ambiente de Preparo.

Você também pode usar essa tarefa para iniciar, parar ou excluir um slot. Ou você pode usá-lo para instalar extensões de site ou para habilitar o monitoramento contínuo no Serviço de Aplicativo.

  1. No Visual Studio Code, modifique azure-pipelines.yml usando este código:

    Dica

    Você pode substituir todo o arquivo ou apenas atualizar a parte que está realçada.

    trigger:
- '*'

variables:
  buildConfiguration: '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
  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: website'
            inputs:
              azureSubscription: 'Resource Manager - Tailspin - Space Game'
              appName: '$(WebAppNameDev)'
              package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'

- stage: 'Test'
  displayName: 'Deploy to the test environment'
  dependsOn: Dev
  jobs:
  - deployment: Deploy
    pool:
      vmImage: 'ubuntu-20.04'
    environment: test
    variables:
    - group: 'Release'
    strategy:
      runOnce:
        deploy:
          steps:
          - download: current
            artifact: drop
          - task: AzureWebApp@1
            displayName: 'Azure App Service Deploy: website'
            inputs:
              azureSubscription: 'Resource Manager - Tailspin - Space Game'
              appName: '$(WebAppNameTest)'
              package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'

- stage: 'Staging'
  displayName: 'Deploy to the staging environment'
  dependsOn: Test
  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: website'
            inputs:
              azureSubscription: 'Resource Manager - Tailspin - Space Game'
              deployToSlotOrASE: 'true'
              resourceGroupName: 'tailspin-space-game-rg'
              slotName: 'swap'
              appName: '$(WebAppNameStaging)'
              package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/*.zip'
          - task: AzureAppServiceManage@0
            displayName: 'Swap deployment slots'
            inputs:
              azureSubscription: 'Resource Manager - Tailspin - Space Game'
              resourceGroupName: 'tailspin-space-game-rg'
              webAppName: '$(WebAppNameStaging)'
              sourceSlot: 'swap'
              targetSlot: 'production'
              action: 'Swap Slots'

    Observe estas alterações:

    • A tarefa AzureWebApp@1 agora especifica estes valores:
      • deployToSlotOrASE, quando definido como true, é implantado em um slot de implantação existente.
      • resourceGroupName especifica o nome do grupo de recursos. Esse valor é necessário quando deployToSlotOrASE é true.
      • slotName especifica o nome do slot de implantação. Aqui você implanta no slot chamado swap.
    • A nova tarefa, AzureAppServiceManage@0, troca os slots de implantação.
      • sourceSlot e targetSlot especificam os slots a serem trocados.
      • action especifica a ação a ser tomada. Lembre-se de que você pode usar essa tarefa para iniciar, parar ou excluir um slot. Aqui, "Swap Slots" especifica a troca dos slots de origem e de destino.

    Essa configuração sempre é implantada no slot swap. Em seguida, ele troca os slots production e swap. O processo de troca garante que o production aponte para a implantação mais recente.

  2. No terminal integrado, adicione azure-pipelines.yml ao índice. Faça o commit das alterações e efetue push do branch para o GitHub.

    Dica

    Salve azure-pipelines.yml antes de executar esses comandos Git.

    git add azure-pipelines.yml
git commit -m "Swap deployment slots"
git push origin blue-green

  3. No Azure Pipelines, rastreie o build por meio de cada uma das etapas.

Observação

Se você encontrar o erro ...'staging' slot did not respond to http ping. (CODE: 417) a seguir, tente reiniciar o serviço do seu aplicativo. Se o problema persistir, redefina a troca automática para o seu slot.

  1. Como uma etapa opcional, em um navegador, acesse a URL que corresponde a cada fase.

    Embora ainda não tenha feito alterações no site, você verá que o site Space Game foi implantado com êxito em cada ambiente do Serviço de Aplicativo.

    Screenshot of a browser that shows the Space Game website in the Dev environment.