Blob in javascript. Convert base64 data into blob using javascript

What is Blob in javascript?

B

lobs are immutable objects that represent the raw data. the file in javascript is a derivation of Blob that describe the data from file system. You can construct the file like objects, you can construct a Blob containing the data for an image.
Blobs are simply a binary string, a byteArray, we can use Blob to store or represent the media ( file, mp3, image, document) that won't store correctly in a normal string.
You can use FileReader() or URL.createObjectURL() to read the contents. if you want to use/show that file/media (Blob) in the HTML element then you need to use URL.createObjectURL() to generate a URL and can use in href or src attributes.

Blob in javascript

Let's write a method in javascript to convert base64 data into Blob:

In the below code, you need to pass the base64 data and it will return blob data:

                        b64toBlob = (b64Data, contentType = '', sliceSize = 512) => {
                            const byteCharacters = atob(b64Data);
                            const byteArrays = [];
                        
                            for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
                              const slice = byteCharacters.slice(offset, offset + sliceSize);
                              const byteNumbers = new Array(slice.length);
                        
                              for (let i = 0; i < slice.length; i++) {
                                byteNumbers[i] = slice.charCodeAt(i);
                              }
                              const byteArray = new Uint8Array(byteNumbers);
                              byteArrays.push(byteArray);
                            }
                        
                            const blob = new Blob(byteArrays, { type: contentType });
                        
                            return blob;
                          }         
                              

Conclusion:

In this article, we explored about the blob data and also wrote the code to convert base64 into blob.