Successfully Saving base64 Image to Azure Blob storage but blob image always broken/small white box

Question

I have a image converted to base64 I am trying to upload to my azure blob storage using createBlockBlobFromText.

self.blobServer.createBlockBlobFromText(containe         


        

Answer 1

To visit the images directly via Urls in browser requires binary content. You can convert the base64 encoded string to binary buffer in your node.js backend, and upload the buffer string to Azure Storage.

Please try the following code snippet:

var rawdata = 'data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==';
var matches = rawdata.match(/^data:([A-Za-z-+\/]+);base64,(.+)$/);
var type = matches[1];
var buffer = new Buffer(matches[2], 'base64');

blobsrv.createBlockBlobFromText('mycontainer','profile-pic-123.jpg', buffer, {contentType:type}, function(error, result, response) {
        if (error) {
            console.log(error);
        }else{
         console.log(result)
        }
    });