How to protect the azure blob storage urls from being retrieved by anyone using developer tools

Question

I have to save images/videos in azure blobs and then use them in my site. After doing some research I found that you have to include the blob url in the href tag for the image/video to be retrieved from azure.

However anybody could open the site page and get that blob url and misuse it. Also the site has user authentication, hence only after login should the user be able to see that image/video on the site page.

Is there any other way of retrieving blobs from azure? Or any other solution to the url being openly visible in developer tools?

I am currently using an azure emulator with Visual Studio.

Answer 1

I've recreated an Azure Function that implements the first scenario I mentioned. The Blob URL inside the storage account was not exposed, and the container and everything in it is set to be private. Since I don't know your authentication scheme I skipped that for now, but you could secure this in a number of ways.

There's a few shortcuts in this code, but you'll get the general idea. Here's the code:

public static async Task<HttpResponseMessage> Run(
    [HttpTrigger(AuthorizationLevel.Anonymous, "get", Route = "files/{id}")]
    HttpRequest req, string id, TraceWriter log)
{
    var account = CloudStorageAccount.Parse("UseDevelopmentStorage=true");
    var client = account.CreateCloudBlobClient();
    var container = client.GetContainerReference("sitecontent");
    var blob = container.GetBlockBlobReference(id);

    var stream = new MemoryStream();
    await blob.DownloadToStreamAsync(stream);
    stream.Seek(0, SeekOrigin.Begin);

    HttpResponseMessage result = new HttpResponseMessage(HttpStatusCode.OK);
    result.Content = new StreamContent(stream);
    result.Content.Headers.ContentType =
            new MediaTypeHeaderValue("application/octet-stream");

    return result;
}

I've tested it by referencing it from an HTML file like this:

<img src="http://localhost:7071/api/files/techdays2017.jpg" alt="Me at TechDays 2017" />

The image I used was 267KB, response times of the Function were all < 200 ms when testing locally using the Storage Emulator.

Answer 2

Not sure if the question is valid, but another very simple approach could be

1. Use a custom domain with your storage endpoint
2. Make your blobs and containers private
3. using backend infra, generate a Shared Access Token which should be valid only for short duration.
4. Use the SAS to generate blob urls.

Incase you need to hide the structure alltogether, all the steps could be used in conjugation with functions as mentioned in answer by @rick.

One thing to understand is that video stream needs to go to browser player, so there cannot be any perfect plan. The above option also will just time bound the access. There could be some other options like message layer encryption by which the server sends in encrypted content and it will be decrypted at runtime You need to have some custom player functionality as well as this could incur higher charges on server side..

Even this will not user from pirating video if he has skillset and high motivation, but can somehow make it difficult and that should be driving point here.

Ref: https://learn.microsoft.com/en-us/azure/storage/common/storage-dotnet-shared-access-signature-part-1