I need to upload an image to NodeJS server to some directory. I am using connect-busboy
node module for that.
I had the dataURL
of the image that I converted to blob using the following code:
dataURLToBlob: function(dataURL) { var BASE64_MARKER = ';base64,'; if (dataURL.indexOf(BASE64_MARKER) == -1) { var parts = dataURL.split(','); var contentType = parts[0].split(':')[1]; var raw = decodeURIComponent(parts[1]); return new Blob([raw], {type: contentType}); } var parts = dataURL.split(BASE64_MARKER); var contentType = parts[0].split(':')[1]; var raw = window.atob(parts[1]); var rawLength = raw.length; var uInt8Array = new Uint8Array(rawLength); for (var i = 0; i < rawLength; ++i) { uInt8Array[i] = raw.charCodeAt(i); } return new Blob([uInt8Array], {type: contentType}); }
I need a way to convert the blob to a file to upload the image.
Could somebody help me with it?
Advertisement
Answer
This function converts a Blob
into a File
and it works great for me.
Vanilla JavaScript
function blobToFile(theBlob, fileName){ //A Blob() is almost a File() - it's just missing the two properties below which we will add theBlob.lastModifiedDate = new Date(); theBlob.name = fileName; return theBlob; }
TypeScript (with proper typings)
public blobToFile = (theBlob: Blob, fileName:string): File => { var b: any = theBlob; //A Blob() is almost a File() - it's just missing the two properties below which we will add b.lastModifiedDate = new Date(); b.name = fileName; //Cast to a File() type return <File>theBlob; }
Usage
var myBlob = new Blob(); //do stuff here to give the blob some data... var myFile = blobToFile(myBlob, "my-image.png");