CODEWITHSUNDEEP
azuresvgblob
JamesP
JamesP

Reputation: 161

Referencing SVG file from Azure blob

I just came across a very strange problem:

<div class="logo-holder">
    <img class="sponsorhip-logo-preview" id="LogoPreview"         
        src="http://cdn.insights.bio/uploads/83cfc94c4a8c4f14b3cd050cd7e1c7aa.svg">
</div>

Using an SVG file as the source of the image results with broken image in chrome

This image is stored on azure CDN. I do not see any error in Chrome console.

Has anyone come across this problem?

Upvotes: 4

Views: 2595

Answers (2)

untrue
untrue

Reputation: 1

With the azure blob storage java package you can get the file content type and add it to the BlobServiceClient header:

        ClientOptions options = new ClientOptions();
        MimetypesFileTypeMap fileTypeMap = new MimetypesFileTypeMap();
        String mimeType = fileTypeMap.getContentType(file.getName());
        HttpHeader httpHeaders = new HttpHeader("Content-Type", mimeType);
        options.setHeaders(Collections.singleton(httpHeaders));

        BlobServiceClient blobServiceClient = new BlobServiceClientBuilder()
        .connectionString(connectStr)
        .clientOptions(options)
        .buildClient();

Upvotes: 0

JamesP
JamesP

Reputation: 161

In the end, I've managed to figure out thank you to Markus.

During image upload to Azure blob, all files were uploaded with default content-type. This line of code made all the huge difference 

 if (DoesBlobFileExist(blobName))
                blobName = RenameFile(blobName);
            CloudBlockBlob blob = container.GetBlockBlobReference(blobName);
            if (blobName.EndsWith(".svg"))
                blob.Properties.ContentType = "image/svg+xml";

Upvotes: 5

Related Questions