How to convert a file URI into a Blob

If I have a file URI (not only an image, but a video file for instance). How can I convert it into a Blob?

There are a few source code options if you search Stack Overflow, though the most thorough code seems to me to be in the npm dataurl-to-blob package. I’ve never tested any of these rigorously though, so I don’t vouch for anything. The bigger deal in your question is that you mentioned video. Video files are different from image files, because different devices in different geographical areas play back differently. If you know for sure that every user of your app will be using an iPhone in Country X, then it isn’t a big deal. But if you want people to record and play video in multiple countries, and on both Android and iPhone, then that requires a lot of work, and it’s probably best to get a video backend as a service.

1 Like

Thanks for your comments! I’m planing to use only video and likely in different countries and on both iOS and Android. But to begin with the US. I’ve managed to solve this issue via getting the video file via as an encoded data URL and then load that into Firebase. Works well so far in iOS, but slow. Will do for my NVP, but later will consider something more sofisticated.

I’ve doner something similar – maybe even the same thing. Setting a fileReader to read the file off the device as a dataURL, and then to store the dataURL in Firebase Storage. But I don’t think that’s a real solution – doesn’t handle video streaming or the need for multiple codecs. So I’ve looked at using Red5Pro as a video backend, but it’s expensive, and I don’t know whether I can justify that. Anyway, I don’t have a solution to the problem yet, so if you come up with something you like, please consider letting me know.

1 Like