upload canvas image using ng-file-upload $upload.upload

Question

I'm using CamanJS in the front end to manipulate an image that i want to upload back to the server. I'm having trouble creating an HTML File object out of that canvas object to pass as an argument to the $upload.upload method. Alternative i can get an turn the canvas into an image html tag but i'm still stuck at the point of turning it to a File. Any leads would be appreciated or alternative ways of doing this.

Answer 1

You can call

  this.render(function () {
    ...
    var b64Data = this.toBase64();
    var blob = b64toBlob(b64Data, contentType);
    Upload.upload({file:blob, url:....})
  });

For b64toBlob function see: https://stackoverflow.com/a/16245768/1105011

Alternatively you can just send the base64 encoding of the file to the server and convert it to the file byte array on your server which would be different implementation depending on which server you are using.