0

Is there a way to convert an HTML5 canvas to a some sort of an image format so that it can be uploaded to facebook users application album though the js api,

I'm currently successfully uploading an image link to an album with the following function:

FB.api('/me/photos', 'post', { message:'the message', url:imgURL});
rfsbraz
  • 2,101
  • 1
  • 18
  • 26
Dnu_12
  • 45
  • 1
  • 10

1 Answers1

-1

Yes, there is way to convert HTML5 Canvas to an image. Following javascript function on the Canvas JS element will do this:

toDataURL('image/jpeg', 1.0);

You can have PNG also.

This function will generate a Base64 representation of the canvas image. I am not sure if you can directly give a Base64 string to the Facebook API.

If you can, then it will be great, otherwise you need to save it temporarily on the server and give that URL to the FB API.

sth
  • 222,467
  • 53
  • 283
  • 367
Purusottam Kaushik
  • 169
  • 1
  • 10
  • Thanks @Kaushik, the toDataURL works well in converting it to a data url image. I guess i have to upload to server and send the url to facebook (tried to send the data url generated as the image url and faild with the error saying that the data url is an internal url, but this is an external request). But then again there are other issues arising while using the toDataURL method. It leads to a security error (no solution) if i have an external image in the canvas. – Dnu_12 Jul 31 '12 at 17:41
  • Yes @Dnu_12 you are right. If you have images from different domain then it will give Cross Domain Security error. few months back I was working on Scrapbook application. There I face the same issue with Canvas. In order to overcome this issue I first downloaded the image on my server and then used that image (as image is now on same domain) to be placed in canvas. You need to remove downloaded images once you are done with them in order to save yr disk space on Server. Hope this helps. – Purusottam Kaushik Aug 01 '12 at 09:21