How to upload image to Azure Blob Storage with proper content type

Question

I've read most of the documentation provided by MS to upload files/image to Blob Storage. It's been two days now and I'm stuck. I don't find an appropriate way to upload image with proper content-type. The file/image is uploaded but the content-type after upload to BLOB Storage is changed to 'application/octet-stream'. I want it to be 'image/png' or 'image/jpg' etc. for an image.

There are samples of C# code but they are not useful. I'm trying with node.js

SDK Library Used : @azure/storage-blob

References :

Sample Code :

const bc = new BlockBlobClient(
    rhcConfig.STORAGE_CONNECTION_STRING,
    rhcConfig.CONTAINER_NAME,
    `IMAGES/${fileName}`
  );

  // let result = await bc.uploadFile(_file);
  // console.log(result);

  const buff = Buffer.from(file, "base64");
  const stream = getStream(buff);
  const streamLength = buff.length;
  await bc.uploadStream(stream, streamLength, 1, { httpHeaderOptions });

httpHeaderOptions :

const httpHeaders = {
    "x-ms-blob-cache-control": "1000",
    "x-ms-blob-content-type": "image/png",
    "x-ms-blob-content-md5": `${md5Hash}`,
    "x-ms-blob-content-encoding": "compress",
    "x-ms-blob-content-language": "en",
    "x-ms-blob-content-disposition": "multipart/form-data",
  };
  const httpHeaderOptions = { blobHTTPHeaders: httpHeaders };

Thanks to the community !!

George Chen George Chen · Accepted Answer · 2020-04-20T06:08:37

Suppose your httpHeaderOptions format is not correct, you could refer to this interface description:BlobHTTPHeaders, below is my test code.

const blobServiceClient = BlobServiceClient.fromConnectionString(connectionstr)

const containerClient=blobServiceClient.getContainerClient('test')
const blobclient=containerClient.getBlockBlobClient('test.jpg')
let fileStream = fs.createReadStream('E:\\dog.jpg');
const blobOptions = { blobHTTPHeaders: { blobContentType: 'image/jpg' } };
blobclient.uploadStream(fileStream,undefined ,undefined ,blobOptions)

How to upload image to Azure Blob Storage with proper content type

2 Answers