Mostre o arquivo de imagem do Azure blob no navegador e não force o download

Aug 16 2020

Esta pergunta foi feita antes de um tempo atrás. Espero que a resposta seja diferente hoje.

  • 3 anos atrás - os arquivos de armazenamento do Azure forçam o download para o navegador

Estou usando o armazenamento de blob do Azure para salvar imagens (jpg) para um site. Estou vinculando diretamente aos arquivos em minhas <img>tags e está funcionando muito bem (tenho acesso anônimo ativado). O problema é que se o usuário clicar na imagem (que tem link direto para o arquivo) ele é forçado a baixá-lo e não consegue visualizá-lo no navegador.

Existe uma maneira de definir os cabeçalhos para o armazenamento de blob para permitir a visualização diretamente no navegador e não forçar um download.

Atualização 1:

Com base nisso, como posso exibir uma imagem do Armazenamento de Blobs do Azure em vez de baixá-la? e istohttps://social.msdn.microsoft.com/Forums/windowsapps/en-US/b8759195-f490-420b-a587-2bb614366ad2/embedding-images-from-blob-storage-in-ssrs-report-does-not-work

Descobri que não estou definindo o tipo de conteúdo, o que está causando o problema. Eu preciso configurá-lo para "image/jpeg". No entanto, não tenho certeza de como fazer isso. Este é o código que estou usando para armazenar a imagem.

using Microsoft.Azure.Storage.Blob

/// <summary>
/// Save a file to azure blob storage.
/// </summary>
/// <param name="name">Name of file</param>
/// <param name="file">filestream</param>
/// <param name="ct">Cancellationtoken</param>
public async Task<bool> SaveFile(Stream fileStream, string fileName, CancellationToken ct)
{
   CloudBlockBlob cloudBlockBlob = _blobContainer.GetBlockBlobReference(fileName);

   fileStream.Position = 0;
   await cloudBlockBlob.UploadFromStreamAsync(fileStream, ct);

   return true;
}

Não encontrei nenhum tipo de propriedade ".Content" ou "Type" nisso. Vou continuar cavando.

Atualização 2: pode ter encontrado a solução:

cloudBlockBlob.Properties.ContentType = "image/jpg";

teste

Atualização 3: Isso fez isso. Use isso para definir os tipos de conteúdo adequados para imagens e PDF e agora eles podem ser visualizados no navegador.

if (fileName.EndsWith(".jpg"))
{
    cloudBlockBlob.Properties.ContentType = "image/jpg";
}
else if (fileName.EndsWith(".pdf"))
{
    cloudBlockBlob.Properties.ContentType = "application/pdf";
}

Respostas

3 JensB Aug 16 2020 at 03:42

Veja a pergunta para detalhes. Mas definir o tipo de conteúdo pode ser feito com:

cloudBlockBlob.Properties.ContentType = "image/jpg";