i writing addon in firefox automatically sends contents of canvas imgur. have built similar extension in chrome, works expected, know usage of imgurs api correct. when use same approach in firefox addon, response:
{ "data": { "error": "image format not supported, or image corrupt.", "request": "/3/upload", "method": "post" }, "success": false, "status": 400 } this use extract image data , send imgur api:
request({ url: 'https://api.imgur.com/3/upload', contenttype : 'json', headers: { 'authorization': 'client-id ' + imgurclientid }, content: { type: 'base64', key: imgurclientsecret, name: 'neon.jpg', title: 'test title', caption: 'test caption', image: getimageselection('image/jpeg').split(",")[1] }, oncomplete: function (response) { if (callback) { callback(response); } else { var win = window.open(response['data']['link'], '_blank'); win.focus(); closewindow(); } } }).post(); and used selection canvas , dataurl of selection:
function getimageselection(type) { //create copy of cropped image var mainimagecontext = mainimage.getcontext('2d'); var imagedata = mainimagecontext.getimagedata(selection.x, selection.y, selection.w, selection.h); var newcanvas = tabdocument.createelement("canvas"); newcanvas.width = selection.w; newcanvas.height = selection.h; newcanvas.getcontext("2d").putimagedata(imagedata, 0, 0); return mainimage.todataurl(type) } i have tried everything: using dataurl original canvas (mainimage), getting dataurl without type, this: .replace(/^data:image\/(png|jpg);base64,/, "");
but imgur keeps complaining bad format.
in end, turned out usage of request module of firefox addon sdk wrong.
instead of using contenttype provide type of content (like in jquery/ajax), have use datatype. see below:
request({ url: 'https://api.imgur.com/3/upload', datatype : 'json', headers: { 'authorization': 'client-id ' + imgurclientid }, content: { type: 'base64', key: imgurclientsecret, name: 'neon.jpg', title: 'test title', caption: 'test caption', image: getimageselection('image/jpeg', true) }, oncomplete: function (response) { response = json.parse(response.text); if (callback) { callback(response); } else { var win = window.open(response['data']['link'], '_blank'); win.focus(); closewindow(); } } }).post(); 