Use GM_xmlhttpRequest to POST data on Chrome? - google-chrome

Question

I'm writing a user script to take an image from a page, and upload it to a server.
The script works fine in FF (Greasemonkey and Scriptish), but when I use Chrome (using Tampermonkey or Ninjakit), it does not send the data, it sends the string * [object Object] * instead.
Here is my script:
// ==UserScript==
// #id myid
// #name myname
// #version 1.0
// #namespace ohadcn
// #author Ohad Cohen
// #description mydescription
// #include https://*
// #grant GM_xmlhttpRequest
// #require https://code.jquery.com/jquery-2.0.3.min.js
// #run-at document-end
// ==/UserScript==
function getBase64Image(img) {
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
var dataURL = canvas.toDataURL("image/png");
return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}
img=$("img[alt=myImage]").get(0);
img.onload=function(){
var img64=getBase64Image(img)
var _data=new FormData();
_data.append("image64",img64);
GM_xmlhttpRequest({
method: "POST",
url: "http://myserver.org/mysscript.py",
headers: {
"Content-Type": "multipart/form-data"
},
data:_data,
onload: function(response) {
console.log ("gut response");
$("#input").get()[0].value=response.responseText;
}
});
}
Both Tampermonkey and Ninjakit do send the request. In Tampermonkey, I get a response, in Ninjakit I don't (onload is never called).
But they do not send the actual image encoded with base64 - when I read the data - the server gets [object Object] as the POST body (Instead of data body, I can't get devtools network panel to show requests made by GM_xmlhttpRequest, so I checked it on the server side).

Answer 1

It might be that FormData and multipart/form-data are not well supported on those platforms. Need to look into it more (later).
Meanwhile, try the more typical approach; use application/x-www-form-urlencoded or JSON.
EG:
GM_xmlhttpRequest ( {
method: "POST",
url: "http://myserver.org/mysscript.py",
data: "image64=" + encodeURIComponent (img64),
headers: {
"Content-Type": "application/x-www-form-urlencoded"
},
onload: function (response) {
console.log ("gut response");
$("#input").get()[0].value=response.responseText;
}
} );