Självstudie: Automatisera storleksändring av uppladdade bilder med Event Grid

Azure Event Grid är en händelsetjänst för molnet. Med Event Grid kan du skapa prenumerationer på händelser som genereras av Azure-tjänster eller resurser från tredje part.

Den här självstudien är del två i en serie med Storage-självstudier. Den bygger vidare på föregående Storage-självstudie och lägger till serverfri och automatisk generering av miniatyrbilder med Azure Event Grid och Azure Functions. Event Grid gör att Azure Functions kan svara på Azure Blob Storage-händelser och generera miniatyrbilder av bilder som laddats upp. En händelseprenumeration skapas mot skapandehändelsen i Blob Storage. När en blob läggs till i en viss Blob-lagringscontainer anropas en funktionsslutpunkt. Data som skickas till funktionsbindningen från Event Grid används till att få åtkomst till bloben och generera miniatyrbilden.

Du kan använda Azure CLI och Azure-portalen till att lägga till funktionen för storleksändring i en befintlig app för uppladdning av bilder.

I den här guiden får du lära dig att:

  • Skapa ett Azure Storage-konto
  • Distribuera serverfri kod med Azure Functions
  • Skapa en prenumeration på en Blob Storage-händelse i Event Grid

Förutsättningar

Anteckning

Den här artikeln använder Azure Az PowerShell-modulen, som är den rekommenderade PowerShell-modulen för att interagera med Azure. För att komma igång med Az PowerShell kan du läsa artikeln om att installera Azure PowerShell. Information om hur du migrerar till Az PowerShell-modulen finns i artikeln om att migrera Azure PowerShell från AzureRM till Az.

För att slutföra den här kursen behöver du:

Skapa ett Azure Storage-konto

För Azure Functions krävs ett allmänt lagringskonto. Utöver bloblagringskontot som du skapade i föregående självstudie skapar du ett separat allmänt lagringskonto i resursgruppen. Namnet på ett lagringskonto måste vara mellan 3 och 24 tecken långt och får endast innehålla siffror och gemener.

Ange variabler som ska innehålla namnet på den resursgrupp som du skapade i föregående självstudie, platsen för de resurser som ska skapas och namnet på det nya lagringskonto som Azure Functions kräver. Skapa sedan lagringskontot för Azure-funktionen.

Använd kommandot New-AzStorageAccount.

  1. Ange ett namn för resursgruppen.

    $resourceGroupName="myResourceGroup"
    
  2. Ange lagringskontots plats.

    $location="eastus"    
    
  3. Ange namnet på lagringskontot som ska användas av funktionen.

    $functionstorage="<name of the storage account to be used by the function>"    
    
  4. Skapa ett lagringskonto.

    New-AzStorageAccount -ResourceGroupName $resourceGroupName -AccountName $functionstorage -Location $location -SkuName Standard_LRS -Kind StorageV2        
    

Skapa en funktionsapp

Du måste ha en funktionsapp som värd för körning av funktionen. Funktionsappen är en miljö för serverfri körning av funktionskoden.

I följande kommando anger du ditt unika namn på funktionsappen. Funktionsappens namn används som DNS-standarddomän för funktionsappen. Därför måste namnet vara unikt bland alla appar i Azure.

Ange ett namn för funktionsappen som ska skapas och skapa sedan Azure-funktionen.

Skapa en funktionsapp med kommandot New-AzFunctionApp.

  1. Ange ett namn för funktionsappen.

    $functionapp="<name of the function app>"    
    
  2. Skapa en funktionsapp.

    New-AzFunctionApp -Location $location -Name $functionapp -ResourceGroupName $resourceGroupName -Runtime PowerShell -StorageAccountName $functionstorage    
    

Konfigurera nu funktionsappen så att den ansluter till bloblagringskontot som du skapade i föregående självstudie.

Konfigurera funktionsappen

Funktionen behöver autentiseringsuppgifter för Blob Storage-kontot, som läggs till i programinställningarna för funktionsappen med kommandot az functionapp config appsettings set eller Update-AzFunctionAppSetting.

storageConnectionString=$(az storage account show-connection-string --resource-group $resourceGroupName --name $blobStorageAccount --query connectionString --output tsv)

az functionapp config appsettings set --name $functionapp --resource-group $resourceGroupName --settings AzureWebJobsStorage=$storageConnectionString THUMBNAIL_CONTAINER_NAME=thumbnails THUMBNAIL_WIDTH=100 FUNCTIONS_EXTENSION_VERSION=~2 FUNCTIONS_WORKER_RUNTIME=dotnet
$storageConnectionString=$(az storage account show-connection-string --resource-group $resourceGroupName --name $blobStorageAccount --query connectionString --output tsv)

Update-AzFunctionAppSetting -Name $functionapp -ResourceGroupName $resourceGroupName -AppSetting @{AzureWebJobsStorage=$storageConnectionString; THUMBNAIL_CONTAINER_NAME=thumbnails; THUMBNAIL_WIDTH=100 FUNCTIONS_EXTENSION_VERSION=~2; 'FUNCTIONS_WORKER_RUNTIME'='dotnet'}

Inställningen FUNCTIONS_EXTENSION_VERSION=~2 får funktionsappen att köra version 2.x av Azure Functions-körningen.

Nu kan du distribuera ett funktionskodprojekt till den här funktionsappen.

Distribuera funktionskoden

Storleksändringsfunktionen för C#-exemplet finns tillgängligt på GitHub. Distribuera kodprojektet till funktionsappen med kommandot az functionapp deployment source config.

az functionapp deployment source config --name $functionapp --resource-group $resourceGroupName --branch master --manual-integration --repo-url https://github.com/Azure-Samples/function-image-upload-resize

Funktionen för att ändra bildstorlek utlöses av HTTP-förfrågningar som skickats till den från tjänsten Event Grid. Du kan ange för Event Grid att du vill hämta meddelandena via funktionens URL genom att skapa en händelseprenumeration. För den här självstudien prenumererar du på blob-skapade händelser.

Data som skickas till funktionen från Event Grid-meddelandet inkluderar blobens URL. URL:en skickas sedan till indatabindningen för att hämta den uppladdade avbildningen från Blob Storage. Funktionen genererar en miniatyrbild och skriver den resulterande dataströmmen till en separat container i Blob Storage.

I det här projektet används EventGridTrigger som typ av utlösare. Det är bättre att använda Event Grid-utlösaren än någon allmän HTTP-utlösare. Event Grid verifierar automatiskt Event Grid Function-utlösare. Med allmänna HTTP-utlösare måste du implementera verifieringssvaret.

Mer information om den här funktionen finns i filerna function.json och run.csx.

Funktionsprojektkoden distribueras direkt från den offentliga exempeldatabasen. Mer information om distributionsalternativen för Azure Functions finns i Kontinuerlig distribution för Azure Functions.

Skapa en händelseprenumeration

En händelseprenumeration anger vilka provider-genererade händelser du vill skicka till en viss slutpunkt. I det här fallet exponeras slutpunkten av din funktion. Använd följande steg till att skapa en händelseprenumeration som skickar meddelanden till din funktion i Azure-portalen:

  1. I Azure Portalsök efter och välj den funktionsapp som du nyss skapade längst upp på sidan. Välj Funktioner och sedan miniatyrfunktionen.

    Välj miniatyrfunktionen i portalen

  2. Välj Integrering och välj sedan Event Grid utlösare och välj Skapa Event Grid prenumeration.

    Gå till Lägg Event Grid prenumeration i Azure Portal

  3. Använd de inställningar för händelseprenumerationen som anges i tabellen.

    Skapa händelseprenumeration från funktionen i Azure-portalen

    Inställning Föreslaget värde Beskrivning
    Namn imageresizersub Namn som identifierar din nya händelseprenumeration.
    Typ av ämne Lagringskonton Välj händelseprovidern för Storage-kontot.
    Prenumeration Din Azure-prenumeration Som standard välj den aktuella Azure-prenumerationen.
    Resursgrupp myResourceGroup Välj Använd befintlig och välj den resursgrupp du har använt i den här självstudien.
    Resurs Ditt Blob Storage-konto Välj det Blob Storage-konto du skapade.
    Systemämnesnamn imagestoragesystopic Ange ett namn för systemämnet. Mer information om systemämnen finns i Översikt över systemämnen.
    Händelsetyper Blob skapas Avmarkera alla typer utom Blob skapas. Det är bara händelsetyper för Microsoft.Storage.BlobCreated som skickas till funktionen.
    Slutpunktstyp genereras automatiskt Fördefinierad som Azure-funktion.
    Slutpunkt genereras automatiskt Namnet på funktionen. I det här fallet är det Miniatyr .
  4. Växla till fliken Filter och gör följande:

    1. Välj alternativet Aktivera ämnesfiltrering.

    2. För Ämne börjar medanger du följande värde: /blobServices/default/containers/images/.

      Ange filter för händelseprenumeration

  5. Välj Skapa för att lägga till händelseprenumerationen. Detta skapar en händelseprenumeration som Thumbnail utlöser funktionen när en blob läggs till i images containern. Funktionen ändrar storlek på avbildningarna och lägger till dem till containern thumbnails.

Nu när tjänsterna på serversidan har konfigurerats ska du testa funktionen för storleksändring i exempelwebbappen.

Testa exempelappen

När du ska testa storleksändring i webbappen bläddrar du till URL-adressen för din publicerade app. Standardwebbadressen för webbappen är https://<web_app>.azurewebsites.net.

Klicka på regionen Upload photos (Ladda upp foton) för att välja och ladda upp en fil. Du kan också dra ett foto till den här regionen.

Observera att när den uppladdade bilden försvinner visas en kopia av den uppladdade bilden i karusellen Genererade miniatyrer. Den här bildens storlek ändrades av funktionen. Därefter lades den till i containern med miniatyrer och laddades ned av webbklienten.

Skärmbild som visar en publicerad webbapp med namnet

Nästa steg

I den här självstudiekursen lärde du dig att:

  • Skapa ett allmänt Azure Storage-konto
  • Distribuera serverfri kod med Azure Functions
  • Skapa en prenumeration på en Blob Storage-händelse i Event Grid

Gå vidare till del tre i Storage-självstudien om du vill lära dig om säker åtkomst till lagringskontot.