Övning – ändra avbildningen och distribuera om webbappen

Slutförd

I den här enheten kommer du att konfigurera kontinuerlig distribution för webbappen och skapa en webhook som länkar till det register som innehåller Docker-avbildningen. Sedan kommer du att göra en ändring i källkoden för webbappen och återskapa avbildningen. Du besöker webbplatsen som är värd för exempelwebbappen igen och kontrollerar att den senaste versionen körs.

Kommentar

Den här övningen skapar ingen Azure Container Registry-uppgift. Istället måste du manuellt återskapa Docker-avbildningen för exempelappen. Webhooken öppnas när den nya Docker-avbildningen skapas.

Konfigurera kontinuerlig distribution och skapa en webhook

  1. Gå tillbaka till Azure Portal och välj din webbapp. Fönstret Apptjänst visas för webbappen.

  2. I det vänstra menyfönstret går du till Distribution och väljer Distributionscenter. Fönstret Distributionscenter visas för din apptjänst (webbapp).

  3. På fliken Inställningar, under Registerinställningar, anger du Kontinuerlig distribution till och väljer sedan Spara i den översta menyraden. Den här inställningen konfigurerar en webhook som Container Registry använder för att avisera webbappen att Docker-avbildningen har ändrats.

    Skärmbild som visar containerinställningarna för webbappen med kontinuerlig distribution aktiverat.

Uppdatera webbappen och testa webhooken

  1. I Azure Cloud Shell går du till mappen dotnet/SampleWeb/Pages. Den här mappen innehåller källkoden för DE HTML-sidor som visas av webbappen.

    cd ~/mslearn-deploy-run-container-app-service/dotnet/SampleWeb/Pages
    
  2. Kör följande kommandon för att byta ut standardsidan i webbappen (Index.cshtml) mot en ny version som har ytterligare ett objekt i karusellkontrollen. Dessa kommandon simulerar fortsatt utveckling i appen och lägger till en ny sida i karusellen.

    mv Index.cshtml Index.cshtml.old
    mv Index.cshtml.new Index.cshtml
    
  3. Kör nästa uppsättning kommandon för att återskapa avbildningen för webbappen och skicka den till Container Registry. Byt ut <container_registry_name> mot namnet på ditt register. Glöm inte . i slutet av det andra kommandot. Vänta tills bygget har slutförts.

    cd ~/mslearn-deploy-run-container-app-service/dotnet
    az acr build --registry <container_registry_name> --image webimage .
    
  4. Gå tillbaka till startsidan för Azure Portal. Välj ditt containerregister från området Senaste resurser . Fönstret Containerregister visas.

  5. I det vänstra menyfönstret går du till Tjänster och väljer Webhooks. Fönstret Webhooks visas för containerregistret.

  6. Välj den enda webhooken i listan. Webhooken för containerregistret visas.

  7. Observera posten för webhooken som just utlöstes som svar på den version och push-överföring som du körde.

    Skärmbild av webhooken som visar push-händelsen.

Testa webbappen igen

  1. Gå tillbaka till din webbapp i webbläsaren. Om du stängde fliken för den tidigare kan du gå till översiktssidan för appen i Azure Portal och välja Bläddra. Det kan uppstå en kallstartsfördröjning när webbappen läser in den nya avbildningen från Container Registry.

  2. Titta igenom objekten i karusellkontrollen. Observera att kontrollen nu innehåller fyra sidor. Den nya sidan ser ut som följande bild:

    Skärmbild av exempelwebbappen.

Webbappen har uppdaterats och omdistribueras automatiskt baserat på den nya avbildningen. Webhook-tjänsten i ditt register meddelade din webbapp att containeravbildningen hade ändrats vilket utlöste en uppdatering.

  1. I Azure Cloud Shell går du till mappen node/routes. Webbappen visar sidor som genererats av källkoden i den här mappen.

    cd ~/mslearn-deploy-run-container-app-service/node/routes
    
  2. Öppna index.js i Cloud Shell-redigeraren.

    code index.js
    
  3. I redigeraren ändrar du koden för att ändra värdet för egenskapen som title skickas till vyn från Express till Microsoft Learn.

    ...
    res.render('index', { title: 'Microsoft Learn' });
    ...
    

    Spara filen när du är klar.

  4. Kör nästa uppsättning kommandon i Cloud Shell för att återskapa avbildningen för webbappen och push-överföra den till Container Registry. Byt ut <container_registry_name> mot namnet på ditt register. Glöm inte . i slutet av det andra kommandot. Vänta tills bygget har slutförts.

    cd ~/mslearn-deploy-run-container-app-service/node
    az acr build --registry <container_registry_name> --image webimage .
    
  5. I det vänstra menyfönstret går du till Tjänster och väljer Webhooks. I fönstret Webhooks i containerregistret väljer du den enda webhooken i listan.

  6. Observera att det finns en post för webhooken som utlöstes som svar på bygget och push-överföringen som du körde.

    Skärmbild av webhooken som visar push-händelsen.

Testa webbappen igen

  1. Gå tillbaka till din webbapp i webbläsaren. Om du stängde fliken för den tidigare kan du gå till sidan Översikt för din webbapp i Azure Portal och i den översta menyraden väljer du Bläddra. Det kan uppstå en kallstartsfördröjning när webbappen läser in den nya avbildningen från Container Registry.

  2. Observera att innehållet på sidan har ändrats för att återspegla de uppdateringar som gjorts i containeravbildningen.

    Skärmbild av exempelwebbappen.

Webbappen har uppdaterats och omdistribueras automatiskt baserat på den nya avbildningen. Webhook-tjänsten i ditt register meddelade din webbapp att containeravbildningen hade ändrats vilket utlöste en uppdatering.