Oefening: een Azure Functions-app implementeren in Azure

Voltooid

Uw project is geleverd met een pijplijn waarmee de projecten in de oplossing worden gebouwd en de web-app wordt geïmplementeerd in Azure-app Service. Nu is het tijd om die pijplijn uit te breiden om ook het nieuwe Azure Functions-project te implementeren.

In dit gedeelte gaat u het volgende doen:

  • Controleer de buildfase .
  • Voeg een taak toe om uw functie-app te implementeren.
  • Voeg een taak toe om de gepubliceerde App Service te configureren voor het gebruik van de gepubliceerde functie.
  • Sla de pijplijn op om een CI/CD-werkstroom te activeren.

De buildfase controleren

Hier bekijkt u de bestaande CI/CD-pijplijn die is gedefinieerd in azure-pipelines.yml.

  1. Navigeer vanuit Azure DevOps naar Pijplijnen.

  2. Selecteer de pijplijn.

  3. Selecteer Bewerken. Zorg ervoor dat de vertakking is ingesteld op main door deze te selecteren in de vervolgkeuzelijst. Hiermee wordt het bestand azure-pipelines.yml weergegeven dat de bestaande CI/CD-pijplijn definieert.

    Vanwege het gebruik van jokertekens voor de projectpaden, worden met de onderstaande gemarkeerde taken automatisch het nieuwe Azure Functions-project hersteld, gebouwd en gepubliceerd.

    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.0.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
    

Andy: Dit was onze vorige buildfase. Ik heb het niet gewijzigd van het oorspronkelijke project omdat de taken al zijn geconfigureerd om te worden uitgevoerd op alle projecten op basis van het jokertekenkoppelingspatroon.

Mara: Ja, dit zou moeten werken zoals het is. Ik denk niet dat we hier wijzigingen moeten aanbrengen. Nadat deze build-taak is uitgevoerd, worden de zip-bestandsartefacten voor zowel het web- als het leaderboard-project gepubliceerd voor de implementatiefase die moet worden gebruikt.

Een taak toevoegen om de Azure-functie te implementeren

Andy: Ik denk dat we de App Service-implementatietaak ook als zodanig opnieuw kunnen gebruiken. Hopelijk is er iets vergelijkbaars dat we kunnen gebruiken voor het implementeren van een functie-app.

Mara: Ik heb goed nieuws. Na een beetje onderzoek lijkt het erop dat er een taak is die conceptueel vergelijkbaar is met de App Service-implementatietaak, maar voor Azure Functions-implementaties. Laten we het nu eens bekijken.

Azure Function-app-taak

De AzureFunctionApp@1 taak is ontworpen voor het implementeren van functie-apps. Het is conceptueel vergelijkbaar met de AzureWebApp@1 taak en bevat alles wat nodig is voor dit functie-app-scenario:

  • azureSubscription verwijst naar de naam van uw Azure-serviceverbindingspijplijnvariabele.
  • appType geeft aan of de app wordt geïmplementeerd voor Linux (functionAppLinux) of Windows (functionApp).
  • appName hiermee geeft u de naam op van het Azure Functions-app-exemplaar in uw Azure-account.
  • package hiermee geeft u het pad naar het pakket dat moet worden geïmplementeerd.
  • runtimeStack geeft aan op welke installatiekopieën de functie moet worden uitgevoerd, wat vereist is voor Linux-implementaties.
  • startUpCommand geeft de opstartopdracht op die moet worden uitgevoerd nadat de functie is geïmplementeerd, wat vereist is voor Linux-implementaties.

Meer informatie over de flexibiliteit van deze taak vindt u in de documentatie voor de azure-functie-app-taak.

Voeg de volgende gemarkeerde code toe aan het einde van uw pijplijn.

- stage: 'Deploy'
  displayName: 'Deploy the web application'
  dependsOn: Build
  jobs:
  - deployment: Deploy
    pool:
      vmImage: 'ubuntu-20.04'
    environment: spike
    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: '$(WebAppName)'
              appType: webAppLinux
              package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/Tailspin.SpaceGame.Web.zip'

          - task: AzureFunctionApp@1
            displayName: 'Azure Function Deploy: leaderboard'
            inputs:
              azureSubscription: 'Resource Manager - Tailspin - Space Game'
              appType: functionAppLinux
              appName: '$(LeaderboardAppName)'
              package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/Tailspin.SpaceGame.LeaderboardFunction.zip'
              runtimeStack: DOCKER|microsoft/azure-functions-dotnet:4
              startUpCommand: 'func azure functionapp publish $(functionAppName) --no-bundler'

Tip

In een YAML-bestand is witruimte belangrijk. Zorg ervoor dat de taak die u hier toevoegt dezelfde inspringing gebruikt als de vorige taak.

Een taak toevoegen om de app-instellingen van App Service bij te werken

Andy: Nu hoeft u alleen maar de web-app te configureren voor het gebruik van de gepubliceerde leaderboard-API. Meestal configureren we variabelen in de portal, maar het is beter als we dit hier kunnen doen. Er wordt een app Instellingen parameter met de naam LeaderboardFunctionUrlverwacht.

Mara: Ik ben het ermee eens. Door een taak aan onze pijplijn toe te voegen, kunnen we onopzettelijke overzichten op de weg voorkomen als we een van beide services wijzigen. We kunnen het meteen aan het eind zetten.

Voeg de volgende gemarkeerde code toe aan het einde van uw pijplijn. Zorg ervoor dat deze overeenkomt met de inspringing van de taak erboven. Als u meer wilt weten over deze taak, kunt u de documenten voor Azure-app Service Instellingen taak bekijken.

- task: AzureFunctionApp@1
  displayName: 'Azure Function Deploy: leaderboard'
  inputs:
    azureSubscription: 'Resource Manager - Tailspin - Space Game'
    appType: functionAppLinux
    appName: '$(LeaderboardAppName)'
    package: '$(Pipeline.Workspace)/drop/$(buildConfiguration)/Tailspin.SpaceGame.LeaderboardFunction.zip'
    runtimeStack: DOCKER|microsoft/azure-functions-dotnet:4
    startUpCommand: 'func azure functionapp publish $(functionAppName) --no-bundler'

- task: AzureAppServiceSettings@1
  displayName: 'Update web app settings'
  inputs:
    azureSubscription: 'Resource Manager - Tailspin - Space Game'
    appName: $(WebAppName)
    resourceGroupName: $(ResourceGroupName)
    appSettings: |
      [
        {
          "name": "AppSettings__LeaderboardFunctionUrl",
          "value": "http://$(LeaderboardAppName).azurewebsites.net/api/LeaderboardFunction",
          "slotSetting": false
        }
      ]

De pijplijn opslaan om een build en release te activeren

  1. Selecteer Opslaan in de rechterbovenhoek van de pagina. Bevestig opslaan om een uitvoering te activeren.

  2. Ga in Azure Pipelines naar de build. Traceer de build terwijl deze wordt uitgevoerd.

  3. Nadat de build is voltooid, selecteert u de implementatietaak van de website en selecteert u de URL om de geïmplementeerde site weer te geven.

    A screenshot of Azure Pipelines, showing the location of the web site URL.

  4. U krijgt een pagina met de site die wordt uitgevoerd op App Service. Schuif omlaag om te bevestigen dat het leaderboard echte gegevens bevat. Dit wordt mogelijk gemaakt door de functie-app.

    A screenshot of the Space Game web site.

    Notitie

    Als er een fout optreedt bij het laden van het leaderboard, controleert u de stappen die u in deze module hebt gevolgd. Als u het uitzonderingsbericht 'Er is geprobeerd toegang te krijgen tot een socket op een manier die is verboden door de toegangsmachtigingen', ziet, controleert u of de app Instellingen__LeaderboardFunctionUrl-instelling van de app-service correct is ingesteld.

  5. U kunt de functie-app ook rechtstreeks testen. Navigeer naar uw URL met behulp van de volgende indeling. Het antwoord is JSON, die alleen als tekst in uw browser moet worden weergegeven.

    http://<leaderboard function name>.azurewebsites.net/api/LeaderboardFunction?pageSize=10
    

    Zoals

    http://tailspin-space-game-leaderboard-4692.azurewebsites.net/api/LeaderboardFunction?pageSize=10
    

    A screenshot of a web browser showing the JSON response from the leaderboard API Azure Functions app.

Andy: Dit bleek geweldig! Iedereen moet behoorlijk onder de indruk zijn van het potentieel dat we hier hebben getoond.