Esercizio: Caricare un'immagine nell'account di Archiviazione di Azure

Completato

Aggiungere il codice per caricare un'immagine nell'account di Archiviazione di Azure. In questo esempio verrà caricata l'immagine seguente nel contenitore di Archiviazione di Azure.

An image of the Docs mascot and the Azure mascot taking a selfie.

Se si usa il computer locale, fare clic con il pulsante destro del mouse sull'immagine e salvarla nella stessa cartella in cui si trova l'applicazione.

  1. Se si usa l'ambiente della sandbox di Microsoft Learn, eseguire il comando seguente nella cartella dell'applicazione per scaricare l'immagine nella sandbox.

    wget https://github.com/MicrosoftDocs/mslearn-connect-app-to-azure-storage/blob/main/images/docs-and-friends-selfie-stick.png?raw=true -O docs-and-friends-selfie-stick.png
    

    In entrambi i casi il nome dell'immagine deve essere docs-and-friends-selfie-stick.png.

Caricare un'immagine nell'archiviazione BLOB

Per usare singoli oggetti BLOB nell'account di Archiviazione di Azure, è possibile usare un oggetto BlobClient. Per ottenere un oggetto BlobClient, chiamare il metodo GetBlobClient nell'oggetto BlobContainerClient del contenitore in cui verrà archiviato il BLOB. Quando si chiama il metodo GetBlobClient, viene specificato anche un nome per il BLOB nel contenitore. Per questo esempio, il nome del BLOB corrisponderà al nome del file.

  1. Con un oggetto BlobClient è possibile chiamare il metodo Upload per caricare un file in Archiviazione BLOB di Azure. Aggiungere il codice seguente al file Program.cs:

    string blobName = "docs-and-friends-selfie-stick";
    string fileName = "docs-and-friends-selfie-stick.png";
    BlobClient blobClient = container.GetBlobClient(blobName);
    blobClient.Upload(fileName, true);
    

    Il secondo argomento nel metodo Upload specifica se è possibile sovrascrivere un oggetto BLOB esistente con lo stesso nome. Per impostazione predefinita, questo valore è false. In questo caso, il valore viene impostato su true per consentire che il programma venga eseguito più volte.

Visualizzare l'elenco degli oggetti in un contenitore di Archiviazione BLOB di Azure

Per verificare il corretto funzionamento del programma, si eseguirà un esercizio con un'altra funzionalità di Azure Storage Blobs SDK che consente di visualizzare un elenco degli oggetti archiviati in un contenitore nell'archiviazione BLOB. Questa operazione può essere eseguita chiamando il metodo GetBlobs in un oggetto BlobContainerClient. Il metodo GetBlobs restituisce un elenco paginabile di oggetti BlobItem che contengono dati relativi a ogni BLOB nel contenitore.

  1. Aggiungere il codice seguente al programma dopo il codice aggiunto in precedenza, quindi salvare il file:

    var blobs = container.GetBlobs();
    foreach (var blob in blobs)
    {
        Console.WriteLine($"{blob.Name} --> Created On: {blob.Properties.CreatedOn:yyyy-MM-dd HH:mm:ss}  Size: {blob.Properties.ContentLength}");
    }
    

    Questo codice chiama GetBlobs nell'oggetto BlobContainerClient per il contenitore photos. Quindi esegue l'iterazione attraverso ogni BLOB visualizzando il nome, la data e l'ora di creazione e la dimensione del BLOB. Quando si esegue il programma, il codice dovrebbe essere visualizzato su una sola riga per la singola immagine caricata.

  2. Il file Program.cs finale deve essere simile al seguente se si vuole verificare il lavoro.

    using System;
    using Microsoft.Extensions.Configuration;
    using System.IO;
    using Azure.Storage.Blobs;
    
    namespace PhotoSharingApp
    {
        class Program
        {
            static void Main(string[] args)
            {
                var builder = new ConfigurationBuilder()
                    .SetBasePath(Directory.GetCurrentDirectory())
                    .AddJsonFile("appsettings.json");
    
                var configuration = builder.Build();
    
                // Get a connection string to our Azure Storage account.
                var connectionString = configuration.GetConnectionString("StorageAccount");
    
                // Get a reference to the container client object so you can create the "photos" container
                string containerName = "photos";
                BlobContainerClient container = new BlobContainerClient(connectionString, containerName);
                container.CreateIfNotExists();
    
                // Uploads the image to Blob storage.  If a blb already exists with this name it will be overwritten
                string blobName = "docs-and-friends-selfie-stick";
                string fileName = "docs-and-friends-selfie-stick.png";
                BlobClient blobClient = container.GetBlobClient(blobName);
                blobClient.Upload(fileName, true);
    
                // List out all the blobs in the container
                var blobs = container.GetBlobs();
                foreach (var blob in blobs)
                {
                    Console.WriteLine($"{blob.Name} --> Created On: {blob.Properties.CreatedOn:yyyy-MM-dd HH:mm:ss}  Size: {blob.Properties.ContentLength}");
                }
            }
        }
    }
    

Eseguire l'app

  1. Compilare ed eseguire l'applicazione per verificare che tutto funzioni e caricare l'immagine in Archiviazione BLOB di Azure.

    Nota

    Assicurarsi di essere nella directory PhotoSharingApp.

    dotnet run
    

Congratulazioni

Sono state apprese le nozioni di base per l'uso del pacchetto Azure Storage Blobs SDK e di Archiviazione BLOB di Azure. Se si desidera, procedere nell'esplorazione creando un altro contenitore, caricando altre immagini nell'account di archiviazione o eliminando un'immagine. Per altre informazioni, vedere la pagina di GitHub sulla libreria client dei BLOB del servizio di archiviazione di Azure per .NET.

Caricare un'immagine nell'archiviazione BLOB

Per usare oggetti BLOB nel contenitore di Archiviazione di Azure, usare un oggetto BlockBlobClient. L'oggetto BlockBlobClient include metodi per caricare, scaricare, elencare ed eliminare oggetti BLOB in un contenitore. Per ottenere BlockBlobObject, chiamare il metodo getBlockBlobClient nell'oggetto ContainerClient. Quindi è possibile usare il metodo uploadFile per caricare l'immagine in Archiviazione di Azure.

  1. Aggiungere questo codice al file dell'applicazione index.js subito dopo il codice che crea il contenitore:

    const filename = 'docs-and-friends-selfie-stick.png';
    const blockBlobClient = containerClient.getBlockBlobClient(filename);
    blockBlobClient.uploadFile(filename);
    

Visualizzare l'elenco degli oggetti in un contenitore di Archiviazione BLOB di Azure

  1. Per verificare che il codice funzioni, è possibile chiamare il metodo listBlobsFlat nell'oggetto ContainerClient nel programma. Aggiungere questo codice al file index.js, quindi salvare il file:

    let blobs = containerClient.listBlobsFlat();
    let blob = await blobs.next();
    while (!blob.done) {
        console.log(`${blob.value.name} --> Created: ${blob.value.properties.createdOn}   Size: ${blob.value.properties.contentLength}`);
        blob = await blobs.next();
    }
    

    Questo codice visualizza tutti i BLOB nel contenitore di Archiviazione BLOB di Azure con la data di creazione e la dimensione del BLOB. Per il programma, nel codice dovrebbe essere presente una riga che rappresenta la singola immagine caricata.

  2. Il file finale avrà un aspetto simile al seguente.

    #!/usr/bin/env node
    require('dotenv').config();
    
    const { BlobServiceClient } = require("@azure/storage-blob");
    
    const storageAccountConnectionString = process.env.AZURE_STORAGE_CONNECTION_STRING;
    const blobServiceClient = BlobServiceClient.fromConnectionString(storageAccountConnectionString);
    
    async function main() {
    // Create a container (folder) if it does not exist
    const containerName = 'photos';
    const containerClient = blobServiceClient.getContainerClient(containerName);
    const containerExists = await containerClient.exists()
    if ( !containerExists) {
        const createContainerResponse = await containerClient.createIfNotExists();
        console.log(`Create container ${containerName} successfully`, createContainerResponse.succeeded);
    }
    else {
        console.log(`Container ${containerName} already exists`);
    }
    
    // Upload the file
    const filename = 'docs-and-friends-selfie-stick.png';
    const blockBlobClient = containerClient.getBlockBlobClient(filename);
    blockBlobClient.uploadFile(filename);
    
    // Get a list of all the blobs in the container
    let blobs = containerClient.listBlobsFlat();
    let blob = await blobs.next();
    while (!blob.done) {
        console.log(`${blob.value.name} --> Created: ${blob.value.properties.createdOn}   Size: ${blob.value.properties.contentLength}`);
        blob = await blobs.next();
    }
    }
    main();
    

Eseguire l'app

  1. Compilare ed eseguire l'applicazione.

    Nota

    Assicurarsi di essere nella directory PhotoSharingApp.

    node index.js
    

    Suggerimento

    Se si verifica un errore sull'uso della parola chiave await, assicurarsi di aver aggiunto la parola chiave async alla definizione di funzione main nell'ultimo passaggio delle istruzioni precedenti.

Congratulazioni

Si sono apprese le nozioni di base per l'uso della libreria client dei BLOB del servizio di archiviazione di Azure per JavaScript e di Archiviazione BLOB di Azure. Se si desidera, procedere nell'esplorazione creando un altro contenitore, caricando altre immagini nell'account di archiviazione o eliminando un'immagine. La pagina della libreria client dei BLOB del servizio di archiviazione di Azure per JavaScript npm.js offre molti esempi d'uso della libreria.