Question 87195 in ASP.NET Question posted in
The official documentation can be found here.

How to create HTML links to download links using Azure Blobs – Asp.net

I am creating a website using Azure Blobs to store content. The website provides Search and Indexing.

When this link is relative,

<a download="" href="./media5/yyy.png">Download</a>

the browser kicks off a "download".

enter image description here

When the files are stored in Blobs, the users get a link like:

<a download="" href="https://xxx.blob.core.windows.net/media5/yyy.png">Download</a>

However, this navigates to the image.

I need the browser "download" to work.

I have tries setting the Storage Account’s CORS Blade:
enter image description here

But this did not do anything.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Manrti is correct CORS is not in play. I deleted the Storage Account's CORS Blade.

    The fix is 3 parts: 1: Set ContentDispoistion header to "attached"

       var blockBlobClient = new BlockBlobClient(connectionString, container, fileInfo.Name, clientOptions);

        var uploadOptions = new BlobUploadOptions();
        uploadOptions.HttpHeaders = new BlobHttpHeaders();

        switch (fileInfo.Extension)
        {
            case ".wav":
                uploadOptions.HttpHeaders.ContentType = "audio/wav";
                break;
            case ".mp3":
                uploadOptions.HttpHeaders.ContentType = "audio/mpeg";
                break;
            case ".mp4":
                uploadOptions.HttpHeaders.ContentType = "video/mp4";
                break;
            case ".jpg":
                uploadOptions.HttpHeaders.ContentType = "image/jpeg";
                break;
            case ".png":
                uploadOptions.HttpHeaders.ContentType = "image/png";
                break;
            case ".zip":
                uploadOptions.HttpHeaders.ContentType = "application/x-zip-compressed";
                break;
            case ".html":
                uploadOptions.HttpHeaders.ContentType = "text/plain";
                break;
            case ".pdf":
                uploadOptions.HttpHeaders.ContentType = "application/pdf";
                break;
            default:
                break;
        }

        uploadOptions.HttpHeaders.ContentDisposition = "attached";
        uploadOptions.ProgressHandler = progressHandler;

        var contentMD5 = await GetContentMD5(blockBlobClient);
        var contentType = await GetContentType(blockBlobClient);

        using (var fs = fileInfo.Open(FileMode.Open, FileAccess.Read, FileShare.Read))
        {
            if ((sourceMD5 != contentMD5) | (contentType != uploadOptions.HttpHeaders.ContentType))
            {
                Console.WriteLine("ttUploading Blob...");
                await blockBlobClient.UploadAsync(fs, uploadOptions);
                contentMD5 = await GetContentMD5(blockBlobClient);
                if (sourceMD5 != contentMD5)
                {
                    throw new Exception($"Uploaded blob ContentMD5[{contentMD5}] does not match SourceMD5Hash[{sourceMD5}] for {blockBlobClient.Name}");
                }
            }
            return blockBlobClient;
        }

    2: You must use a SAS Url to have the Content-Disposition header be returned:

    var uri = blobClient.GenerateSasUri(BlobSasPermissions.Read, new DateTimeOffset(DateTime.UtcNow.AddYears(2)));

    3: HTML Link:

    <a download="" href="https://xxx.blob.core.windows.net/media5/yyy.png?sv=2020-08-04&se=2024-04-08T14%3A43%3A28Z&sr=b&sp=r&sig=ZWdbpd8y2hr02MpzgxDC%2Fu2eqi5HukIYhXnLiYK4Rrk%3D">Download</a>

  2. 0

    CORS is not going to help in this case. If you want to force download the blob, please change the blob’s content-type property to application/octet-stream (or application/binary).

    However, please note that when you change the blob’s content type to application/octet-stream, it will always be downloaded. You will not be able to display the blob in the browser.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search