Posting canvas image to user wall via facebook javascript sdk
I am dynamically creating a html canvas image. I want to post it on facebook user wall via javascript sdk. What i do is
I tried to convert canvas to javascript image object and provide finalimage in fb.ui method
var temp = canvas.toDataURL("image/png");
var finalimage=temp.replace(/^data:image\/(png|jpg);base64,/, "");
FB.ui(
{
method: 'feed',
name: 'The Facebook SDK for Javascript',
caption: 'Bringing Facebook to the desktop and mobile web',
description: (
'A small JavaScript library that allows you to harness ' +
'the power of Facebook, bringing the user\ identity, ' +
'social graph and distribution power to your site.'
),
link: 'https://developers.facebook.com/docs/reference/javascript/',
picture: finalimage
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
But I am getting the error
Error message: Image url is not formatted properly
Can anyone please help how should I do this?
source to share
To do this, you need to save the image on your server, your image must be outside of Facebook, because FB.ui "FEED" does not accept base64 encoded data as an image, its not possible.
Its very big data, and if you try to shorten the base64 code in the url shortler you will run into difficulties too.
What you can do and what I do is use a PHP server to get Base64 data and convert it to an image like a dynamic image, okay? But a memory problem will be created.
Another option is to (really) place the canvas as a picture in the user profile, so you need FB.api for that, instead of FB.ui, the feed dialog is used to exchange links and the canvas has no title, Description, decency.
After the image is posted, you will receive a response with an ID which is the mail ID and this cannot be used as a feed, as a link or property, but you can use the Share dialog if you want to share the message.
This is a piece of cake, I made it and recommend you do the same. Posting Canvas as images usin API on Facebook platform is great, you can do it with JavaScript SDK.
source to share