javascript - Saving an html object to firebase -

i'm working in ember.js project has image cropping mechanic. returns me default canvas object , data necessary redraw cropped image.

but when try save canvas object firebase saves [htmlobject canvas] or that, when try record , display canvas displays instead of actual canvas object.

how can save canvas object firebase use later actual canvas.

you have serialize , deserialize image:

function serialize(canvas) {     return canvas.todataurl(); }  function deserialize(data, canvas) {     var img = new image();     img.onload = function() {         canvas.width = img.width;         canvas.height = img.height;         canvas.getcontext("2d").drawimage(img, 0, 0);     };      img.src = data; } 

based on this answer.

update 1

the canvas.todataurl() method able compress data jpeg compression. using 95% quality drastically decrease filesize photos, compared png.

use this:

canvas.todataurl({    format: 'jpeg',    quality: 0.9 }); 

based on this answer.