How to include text in Share Dialog - javascript

I'd like to share a post via facebook AP but I'm facing some issue.
In my original post i have a text and an image.
By using the share button via Facebook it is possible to keep the original text, while that's not true if I use the Send, Feed or Share Dialog. I also tried using facebook object as reported in the following code, but even in this case I can't figure out how to add text.
Any suggestion?
FB.ui({
app_id: MY_APP_ID,
method: 'share_open_graph',
action_type: 'og.shares',
action_properties: JSON.stringify({
object: {
'og:url': 'www.google.it',
'og:title': 'myTitle',
'og:description': 'myDesc',
'og:image': 'myImg.png'
}
})
}, (response) => {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post wasn t published.');
}
});

Related

How to detect user cancelled share when using fb.ui

I'm using the documentation provided over here with the following code. The share dialog comes up correctly. The problem is that I'm not able to differentiate between "Cancel" and "Post" actions that the user takes on the dialog. I'd imagine this would be a part of the response.
FB.ui({
method: 'share',
href: 'https://developers.facebook.com/docs/',
}, function(response){
if (response && !response.error_code) {
console.log(response);
} else {
alert('Error while posting.');
}
});
edit: output from the console isn't doesn't provide any way of knowing
Cancel - Object {e2e: "{"submit_0":1401181811121}"}
Post - Object {e2e: "{"submit_0":1401181815112}"}
I tested this, and apparently there's some info in the response object you could use to determine if the dialog was cancelled.
Code
FB.ui({
method: 'share',
href: 'https://developers.facebook.com/docs/'
}, function(response){
if (response && !response.error_code) {
console.log("OK: "+JSON.stringify(response));
} else {
console.log("Not OK: "+JSON.stringify(response));
}
});
Output upon cancellation:
{error_code: 4201, error_message: "User+canceled+the+Dialog+flow", e2e: "{"submit_0":1401188820613}"}
So, I guess you could check for cancellaction like this:
FB.ui({
method: 'share',
href: 'https://developers.facebook.com/docs/'
}, function(response){
if (response && !response.error_code) {
console.log("OK: "+JSON.stringify(response));
} else if (response && response.error_code === 4201) { //Cancelled
console.log("User cancelled: "+decodeURIComponent(response.error_message));
} else {
console.log("Not OK: "+JSON.stringify(response));
}
});
Unfortunately, FB.Events.subscribe() doesn't offer an Event for the Cancallation of this dialog: https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/v2.0
This is intentionally so as to dissuade developers from using posting as a gating mechanism. It should be up to the person to choose whether to post or not, it should not be a requirement of the app.
Use "feed" method instead of "share" so that it doesn't require app permission to get the response.
FB.ui({
method: 'feed',
caption: 'My Caption',
link: 'http://www.google.com/'
}, function(response) {
if (response && response.post_id) {
alert('Thank you for sharing!');
} else {
alert('You have cancelled the share.');
}
});
I also have a problem with the response function, I'm currently coding and trying to use fb.UI
return FB.ui({
method: 'share',
href: this.shareUrl,
hashtag: "myHashTag",
quote: "myQuote"
}, function(res) {
console.log("res = ", res);
console.log("res? = ", res != null);
return App.vent.trigger("FBShareView:cancelled");
});
I'm finding that on a successful share, res is an empty array and res != null is true
I'm finding that for the cancel scenario, res is undefined.
I expected to see res as an object with an error_message as described here: https://developers.facebook.com/docs/sharing/reference/share-dialog
Could you tell me what may be going wrong please?

Limit Facebook Share dialog Size

How can I limit the Facebook share dialog size.
I'm using the Javascript SDK, this is my test code.
Test site is here. CLick the 'contact' button to envoke the dialog. The popup resizes to use a very large image size. This is the image specified in the OG:Image tags, but I'd prefer the dialog box to use a small image, and be a set dimension.
Any ideas?
FB.ui(
{
method: 'feed',
name: $(document).find("title").text(),
link: location.href
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
You can manually pass an image to the dialog by adding picture to the FB.ui function, so it doesn't use the image specified in the OG tags. You can then set the URL to the smaller image you want to use.
Example:
FB.ui( {
method: 'feed',
name: $(document).find("title").text(),
link: location.href,
picture: '{url_to_picture}'
}, function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);

Simple Facebook Javascript post to stream example?

I'm trying to post to user stream, without user prompt. I cannot manage to find a code that works. Facebook JSDK is already loaded and I will insert the code inside:
FB.getLoginStatus(function(response){
to make sure the user is already logged to my application. Could you provide an example of publishing to the user stream using the publish_stream permission?
With Dialog
You need to use the Feed Dialog, with FB.ui():
function postToFeed() {
// calling the API ...
var obj = {
method: 'feed',
link: 'https://developers.facebook.com/docs/reference/dialogs/',
picture: 'http://fbrell.com/f8.jpg',
name: 'Facebook Dialogs',
caption: 'Reference Documentation',
description: 'Using Dialogs to interact with users.'
};
function callback(response) {
document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
}
FB.ui(obj, callback);
}
Documentation: https://developers.facebook.com/docs/reference/dialogs/feed/
Without Dialog
To make a post without the Dialog you need to use the FB.api():
var body = 'Reading JS SDK documentation';
FB.api('/me/feed', 'post', { message: body }, function(response) {
if (!response || response.error) {
alert('Error occured');
} else {
alert('Post ID: ' + response.id);
}
});
Documentation: https://developers.facebook.com/docs/reference/javascript/FB.api/
Direct URL
https://www.facebook.com/dialog/feed?
app_id=APP_ID&
link=https://YOUR_DOMAIN&
picture=http://YOUR_DOMAIN/image.jpg&
name=Facebook%20Dialogs&
caption=API%20Dialogs&
description=Using%20Dialogs%20to%20interact%20with%20users.&
redirect_uri=http://YOUR_DOMAIN/response
Documentation: https://developers.facebook.com/docs/reference/dialogs/feed/

Facebook JS - FB.api() only posts message, not media attachment

I'm trying to post to the active users wall with a mp3 attachment. It works fine from
Facebook's Test Console (see below), but when I call it from my mobile app, It only posts the message. What am I missing here :(
Facebook's Test Console: http://developers.facebook.com/docs/reference/rest/stream.publish/
Here is my JS...
Login
FB.login(
function(response) {
if (response.authResponse) {
alert('logged in');
} else {
alert('not logged in');
}
},{ scope: "email,user_likes,publish_stream,offline_access" } //added offline_access to see if that was the problem
);
Post to wall with attachment
var attachment = {
'message': 'testing',
'attachment': {'media': [{
'type': 'mp3',
'src': 'http://www.looptvandfilm.com/blog/Radiohead%20-%20In%20Rainbows/01%20-%20Radiohead%20-%2015%20Step.MP3',
'title': 'Test Title',
'artist': 'My Artist',
'album': 'My Album' }]}
};
FB.api('/me/feed', 'post', attachment, function(response) {
if (!response || response.error) {
alert(response.error.message);
} else {
alert('Post ID: ' + response.id);
}
});
var attachment = {
'message': 'testing',
'source': 'http://www.looptvandfilm.com/blog/Radiohead%20-%20In%20Rainbows/01%20-%20Radiohead%20-%2015%20Step.MP3'
};
This will post the mp3 to your feed allowing a user to click a play button inline. See working example here: http://jsfiddle.net/dmcs/aggJc/1/
As you will note, that when you POST data to the Graph API, the formatting is different than when you GET the same object back. Posting is kinda shorthand notation version and the Getting is the long hand.

Using Facebook Graph to simply post a wall message with just javascript

In Facebook how can I post a message onto a user's wall saying "I scored 8/10 on objects game" then a URL?
I really don't want to have to use the full API, as I don't want to handle user login details. I don't mind if Facebook needs to authenticate and then post the message.
Is it possible using the new Graph API and JavaScript?
Note 4/16/2011: stream.publish seems to have been deprecated, There's a new way to do this: http://developers.facebook.com/docs/reference/dialogs/feed/
You can use something like this to publish to a wall, the user will need to confirm before it get sent.
Don't forget that you'll need to use FB.init and include the JS SDK link.
function fb_publish() {
FB.ui(
{
method: 'stream.publish',
message: 'Message here.',
attachment: {
name: 'Name here',
caption: 'Caption here.',
description: (
'description here'
),
href: 'url here'
},
action_links: [
{ text: 'Code', href: 'action url here' }
],
user_prompt_message: 'Personal message here'
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
}
Post on wall will show a dialog box to share the message on wall or not. But I wanted to post the message silently on user's wall, assuming that user had already given "Post on wall" permission.
FB.api('/me/feed', 'post', {
message:'my_message',
link:YOUR_SITE_URL,
picture:picture_url
name: 'Post name',
description: 'description'
},function(data) {
console.log(data);
});
Considering that you have a proxy to make cross domain calls, you can simply do this...
In this example, YourProxyMethod takes a jQuery.ajax like hash, makes a server side post & returns the response in success/error callbacks. Any regular proxy should do.
The trick is to include app_id and access_token in the URL irself.
Also, your FB app should have sufficient permissions to make this call.
YourProxyMethod({
url : "https://graph.facebook.com/ID/feed?app_id=APP_ID&access_token=ACCESS_TOKEN",
method : "post",
params : {
message : "message",
name : "name",
caption : "caption",
description : "desc"
},
success : function(response) {
console.log(response);
},
error : function(response) {
console.log("Error!");
console.log(response);
}
});

Categories

Resources