Download a photo with Facebook Graph API and JavaScript: convert the canvas image to multipart / form-data as a POST body?


From this SO question on the topic and from our research elsewhere on the web (like this Facebook doc link), it seems possible to upload an image from canvas.toDataURL() to Facebook directly -- without hosting the image on a server.

The problem we're facing is how to convert the base64-encoded data from toDataURL() into the multipart/form-data that Facebook expects. Is this possible on the client side with JavaScript and If not, we can resort to saving the image on a server first but prefer bypassing this step if possible and doing everything from the client.

This is for a PhoneGap app.

Uploading a canvas as a picture on the server is possible. I did a test 2 years ago, you can look up the code:

That was using mootools, but it is really not needed there, everything in the save function is native JS code.

Integrating that with facebook should not be a big problem