HongKun Yoo HongKun Yoo - 2 months ago 5x
Javascript Question

Converting image object to File object, javascript

I want to convert "image object" to "File object" using HTML5 in client side to upload the File to the azure blob storage.

Since I'm using AngularJs, my plan is to

I have found lots of examples that convert File object to image using FileReader, but I can't find the opposite example.

I heard it is impossible to write files to local file system with client javascript, but I don't need to store the File, I just need the file object reference to upload the file.

Is there any way to solve this problem?


There is a way to save files to the local file system, through the File System API, but only Chrome and Opera supports it. If you want to render an image file from File/Blob to an IMG tag, you can do

img.src = URL.createObjectURL(myFileOrBlob);

This will convert the File/Blob to an URL, which is available only inside of your browser and looks like that


After you are done using the image, it's good to free the memory by doing


Hope I understood you correctly and that helps you.