How to create File object from Blob?

Question

DataTransferItemList.add allows you to override copy operation in javascript. It, however, only accepts File object.

Copy event

The

Answer 1

this works with me, from canvas to File [or Blob], with filename!

var dataUrl = canvas.toDataURL('image/jpeg');
var bytes = dataUrl.split(',')[0].indexOf('base64') >= 0 ?
          atob(dataUrl.split(',')[1]) :
          (window).unescape(dataUrl.split(',')[1]);
var mime = dataUrl.split(',')[0].split(':')[1].split(';')[0];
var max = bytes.length;
var ia = new Uint8Array(max);
for (var i = 0; i < max; i++) {
  ia[i] = bytes.charCodeAt(i);
}

var newImageFileFromCanvas = new File([ia], 'fileName.jpg', { type: mime });

Or if you want a blob

var blob = new Blob([ia], { type: mime });