Alıştırma - Azure Depolama hesabınıza görüntü yükleme

Tamamlandı

Şimdi Azure Depolama hesabınıza görüntü yüklemenizi sağlayacak kodu ekleyelim. Bu örnekte aşağıdaki görüntüyü Azure Depolama kapsayıcısına yükleyeceğiz.

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

Yerel makinenizde çalışıyorsanız, bu resme sağ tıklayın ve uygulamanızın bulunduğu klasöre kaydedin.

  1. Microsoft Learn Korumalı Alan ortamında çalışıyorsanız, görüntüyü korumalı alanınıza indirmek için uygulama klasöründe aşağıdaki komutu çalıştırın:

    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
    

    Her iki durumda da resmin adı docs-and-friends-selfie-stick.png olmalıdır.

Blob depolama alanına görüntü yükleme

Azure Depolama hesabınızda ayrı blob nesneleriyle çalışmak için bir BlobClient nesnesi kullanmanız gerekir. Bir BlobClient nesne almak için blobun GetBlobClientBlobContainerClient depolanacağı kapsayıcının nesnesinde yöntemini çağırın. GetBlobClient yöntemini çağırırken kapsayıcı içindeki blob için bir ad da belirtirsiniz. Buradaki örnekte blobun adı, dosyanın adıyla aynı olacaktır.

  1. BlobClient nesnesini oluşturduktan sonra Upload yöntemini çağırarak Azure Blob Depolama alanına dosya yükleyebilirsiniz. Program.cs dosyanıza aşağıdaki kodu ekleyin:

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

    Upload yöntemindeki ikinci bağımsız değişken, aynı ada sahip bir blob nesnesinin üzerine yazılıp yazılmayacağını belirtir. Varsayılan olarak, bu değer şeklindedir false. Bu durumda, programın birden çok kez çalıştırılmasına izin vermenizi belirtiyoruz true .

Azure Blob Depolama kapsayıcısındaki nesneleri listeleme

Programımızın çalıştığını doğrulamak için Azure Depolama Blobları SDK'sının bir diğer özelliğinden faydalanarak blob depolama alanı içindeki kapsayıcıda bulunan nesneleri listeleyeceğiz. Bunun için GetBlobs yöntemini BlobContainerClient nesnesiyle çağıracağız. GetBlobs yöntemi, kapsayıcı içindeki bloblar hakkında veri içeren BlobItem nesnelerinin sayfalara ayrılabilir listesini döndürür.

  1. Daha önce eklediğiniz koddan sonra programınıza aşağıdaki kodu ekleyin ve dosyayı kaydedin:

    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}");
    }
    

    Bu kod, photos kapsayıcısı için BlobContainerClient nesnesinde GetBlobs çağrısı yapar. Ardından işlemi her blob için yineleyerek blobun adını, blobun oluşturulduğu tarihle saati ve blobun boyutunu yazdırır. Programınızı çalıştırdığınızda bu kodun, karşıya yüklediğiniz görüntüye ait tek bir satır olarak gösterilmesi gerekir.

  2. Çalışmanızı denetlemek istiyorsanız program.cs dosyasının son hali şöyle görünmelidir.

    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}");
                }
            }
        }
    }
    

Uygulamayı çalıştırma

  1. Uygulamayı derleyip çalıştırarak her şeyin çalıştığını ve görüntünün Azure Blob Depolama kapsayıcısına yüklendiğini doğrulayın.

    Dekont

    PhotoSharingApp dizininde olduğunuzdan emin olun.

    dotnet run
    

Tebrikler

Azure Depolama Bloblar SDK paketi ve Azure Blob Depolama ile çalışmanın temellerini öğrendinsiniz. Keşfetmeye devam etmek isterseniz yeni bir kapsayıcı oluşturabilir, depolama hesabınıza daha fazla görüntü yükleyebilir veya görüntüleri silebilirsiniz. Daha fazla bilgi için .NET için Azure Depolama Blobları istemci kitaplığı GitHub sayfasını inceleyebilirsiniz.

Blob depolama alanına görüntü yükleme

Azure Depolama kapsayıcınızda blob nesneleriyle çalışmak için bir BlockBlobClient nesnesi kullanmanız gerekir. BlockBlobClient nesnesinde bir kapsayıcı içindeki blob nesnelerini karşıya yüklemeye, indirmeye, listelemeye ve silmeye yönelik yöntemler vardır. BlockBlobObject almak için getBlockBlobClient yöntemini ContainerClient nesnesiyle çalıştırın. Ardından uploadFile yöntemini kullanarak görüntünüzü Azure Depolama alanına yükleyebilirsiniz.

  1. Bu kodu, kapsayıcıyı oluşturan kodun hemen arkasına index.js program dosyanıza ekleyin:

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

Azure Blob Depolama kapsayıcısındaki nesneleri listeleme

  1. Kodun çalıştığını doğrulamak için programınızdaki ContainerClient nesnesinde listBlobsFlat yöntemini çağırabilirsiniz. Bu kodu index.js dosyasına ekleyin ve dosyayı kaydedin:

    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();
    }
    

    Bu kod, Azure Blob Depolama kapsayıcısındaki tüm blobları oluşturma tarihi ve boyutuyla birlikte yazdırır. Programımız için bu kodun karşıya yüklediğimiz tek görüntüyü temsil eden bir satır yazdırması gerekir.

  2. Dosyanın son hali aşağıdaki gibi görünmelidir.

    #!/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();
    

Uygulamayı çalıştırma

  1. Uygulamayı derleyin ve çalıştırın.

    Dekont

    PhotoSharingApp dizininde olduğunuzdan emin olun.

    node index.js
    

    Bahşiş

    Anahtar sözcüğün await kullanımıyla ilgili bir hata alırsanız, önceki yönergelerde async son adıma göre anahtar sözcüğü main işlev tanımına eklediğinizden emin olun.

Tebrikler

JavaScript ve Azure Blob Depolama için Azure Depolama Blob İstemci Kitaplığı'nda çalışmanın temellerini öğrendinsiniz. Keşfetmeye devam etmek isterseniz yeni bir kapsayıcı oluşturabilir, depolama hesabınıza daha fazla görüntü yükleyebilir veya görüntüleri silebilirsiniz. JavaScript npm.js için Azure Depolama Blob İstemci Kitaplığı sayfasında kitaplığın nasıl kullanılacağına ilişkin birçok örnek bulunur.