CODEWITHSUNDEEP
javascriptazurepdfcontent-typeazure-blob-storage
Ruskin
Ruskin

Reputation: 6171

Set ContentType on Azure Blob on upload from Javascript using UploadBrowserDataToBlockBlob

For PDF files to display in the browser - instead of downloading - you need to supply them with the application/pdf content type header.

By default, Azure Blob Storage files are set to application/octet-stream. The content type can be changed on the back-end by updating it on the blob ... we want to set it at upload time.

Uploading PDF files using the @azure/storage-blob (documentation) npm package we cannot find the correct way to set this.

Tried many iterations of the following code to no avail.

...
const blobOptions = {
    metadata: { 'contentType': 'application/pdf' },
    ... other options
};

Azure.uploadBrowserDataToBlockBlob(aborter, file, blob, blobOptions)
...

Upvotes: 1

Views: 3116

Answers (1)

Ruskin
Ruskin

Reputation: 6171

My colleague found an answer:

...
const blobOptions = {
    blobHTTPHeaders: { blobContentType: 'application/pdf' },
    ... other options
};

Azure.uploadBrowserDataToBlockBlob(aborter, file, blob, blobOptions)
...

and added the x-ms-blob-content-type header to Azure storage CORS settings.

Upvotes: 9

Related Questions