Azure Storageにデータを置いてBlazorで画像を表示する。

Hosting Blazor on Azure Storage with an Azure Functions backend – csharp.christiannagel.com

Azure Strageにデータを置いてblazor webassemblyで画像を表示するためには、Blobを使うのがよい。Blob空間上に画像を保存して、画像をWebページ上に保存することとした。具体的な設定は以下を参照。

Azure Storage で静的 Web サイトをホストする | Microsoft Docs

画像をBlobでAzureから取り出してきてWebで表示する。
https://stackoverflow.com/questions/58426668/how-to-get-an-image-from-azure-blob-storage-via-web-api-as-binary

public IActionResult Index()
{
    string connString = "DefaultEndpointsProtocol=https;AccountName=storagetest789;AccountKey=G36mcmEthM****=;EndpointSuffix=core.windows.net";
    CloudStorageAccount storageAccount = CloudStorageAccount.Parse(connString);
    CloudBlobClient cloudBlobClient = storageAccount.CreateCloudBlobClient();

    CloudBlobContainer cloudBlobContainer = cloudBlobClient.GetContainerReference("pub");
    CloudBlockBlob cloudBlockBlob = cloudBlobContainer.GetBlockBlobReference("p033tw9j.jpg");

    using (MemoryStream ms = new MemoryStream())
    {
        cloudBlockBlob.DownloadToStream(ms);
        return File(ms.ToArray(), "image/jpeg");
    }
}


この記事が気に入ったらサポートをしてみませんか?