Всеми любимый canvas имеет классный метод .toDataUrl(), который возвращает base64 закодированный текст. Но, внимание, с припиской вначале: data:image/png;base64, как раз в этом вся и проблема. При сохранении такой последовательности, ваше изображение получается испорченным. Все дело в том, что само изображение это ровно то, что идет после этого. Поэтому берите на вооружение вот такую регулярочку:

imgData.replace(/^data:image\/png;base64,/,'');