What is a Blob URI?
Recently, I started working on a project that extensively utilizes blobs and blob URIs. Wide-spread browser support for blobs has been around for more than several years now. If you aren’t familiar with blob URIs, they look something like this:
blob:http://127.0.0.1:8080/0530b9d1-c1c2-40ff-9f9c-c57336646baa
A blob, in this case, represents an object that is tucked away in a portion of memory within the browser. It can be used and injected into the DOM just like any other URI. You could even issue AJAX requests against it. It is sand-boxed so that only the domain that is mentioned in the URI can access it. For instance, in the example above, if you had another tab open to a different website that website would be unable to access the data pointed to by the blob. Blobs will be destroyed once the browser session terminates so they will need to be re-created again and will be given a different UUID once the session comes back. Another point worth mentioning is that Blobs are immutable, meaning you cannot change them once they have been created.
You may be wondering what the advantage of this could be. In my case, the project that I’ve been working on downloads encrypted data and stores it in IndexedDB. Once it’s time to render that data it will fetch it, decrypt it, stuff it into memory then render the blob. This way the user would never be able to see the original data.