I want to add a custom Facebook share button to my website like the ones you see at the top of BBC news stories, like http://www.bbc.co.uk/news/uk-19535236. They're using the Facebook Feed Dialog for this. So when you click on the link you get a dialog that allows you to post the URL of whatever page you're on to your timeline.
The FB.ui method seems the best way of invoking the dialog, because it automatically creates the right type of popup for your device. So people using mobiles'll see a popup that suits their devices. This method also allows us to specify a callback, so once the user's shared a link we can augment the share count on the page they're sharing.
I'm trying to follow the first example on http://developers.facebook.com/docs/reference/dialogs/feed/.
<div id='fb-root'></div>
<script src='http://connect.facebook.net/en_US/all.js'></script>
<p><a href="#" onclick='postToFeed(); return false;'>Post to Feed</a></p>
<p id='msg'></p>
<script>
FB.init({appId: "00000000000", status: true, cookie: true});
function postToFeed() {
// calling the API ...
var obj = {
method: 'feed',
link: 'http://example.com/',
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'];
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
FB.ui(obj, callback);
}
</script>
(subsituting my actual app_id for 00000000000 and site URL for http://example.com/). But I get this error when I click on the link:
API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: redirect_uri is not owned by the application.
I get this even when the 'link' parameter exactly matches the 'Site URL' for the app in my Facebook app settings.
Can anyone tell me how I can get this to work? I want people to be able to share any page on my site, not just a URL corresponding to my Facebook app.
For sharing to work, minimum requirement in application configuration is to set atleast
App Domains ( under Basic Info )
Site URL ( under Website with Facebook Login )
i.e.
App Domains : example.com
Site URL : http://example.com
setting other parameters can also work like Mobile Site URL etc.
Related
I'm using Facebook Graph API with Javascript to allow the user to share a link. Simple enough.
Javascript code:
var _link = 'http://example.com/ca.a/4102/540/en/1/31';
function share() {
FB.ui({ method: 'share',
href: _link,
redirect_uri: _link,
quote: 'simple name'
},
function (response) { }
);
}
This operation results it a link generated by Facebook API:
https://www.facebook.com/v2.8/dialog/share?app_id=596131650587698&channel_url=http%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter%2Fr%2F0sTQzbapM8j.js%3Fversion%3D42%23cb%3Df2c247478a4c94c%26domain%3Dwebcand.com%26origin%3Dhttp%253A%252F%252Fwebcand.com%252Ff2f0001bcf7065%26relation%3Dopener&display=popup&e2e=%7B%7D&href=http%3A%2F%2Fwebcand.com%2Fca.a%2F4102%2F540%2Fen%2F1%2F31&locale=en_US&name=simple%20name&next=http%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter%2Fr%2F0sTQzbapM8j.js%3Fversion%3D42%23cb%3Df572851e5571f8%26domain%3Dwebcand.com%26origin%3Dhttp%253A%252F%252Fexample.com%252Ff2f0001bcf7065%26relation%3Dopener%26frame%3Df1d6415a361a248%26result%3D%2522xxRESULTTOKENxx%2522"e=Click%20here%20to%20take%20the%20interview&sdk=joey&version=v2.8
Note the &next= parameter. Facebook has wrapped the link I provided with additional data, redirecting it to Fstaticxx.facebook.com.
So now, the share feed looks like this:
The "Object reference not set to an instance of an object" error message is happening because the link I provided expects the format http://example.com/ca.a/A/B/C/D/E and if one of these / params is missing, the exception occurs. So obviously the link alteration causes this.
Passing the URL as A-B-C-D-E works fine, so my conclusion is that the / signs are being removed.
Any suggestion how to fix this?
I have a snippet where I allow a user on my MVC Asp.net Site to publish a POST. It works fine.
What I need is when the POST is published and a facebook user clicks on it (There is a url action that takes you to mywebsite if the user clicks on it) . How would I get the userId or something indicating it was clicked by XXXX facebook user?
Once a user on my site publishes this post, a friend may click on the link and I want to know what user clicked on it.
function facebookShare()
{
FB.ui({
method: 'feed',
name: "My gallery - Price: $49.99",
link: "https://mygallery.net/Product/Details/99",
picture: "http://mygallery.com//Images/Products/image.jpg",
description: "In the last 100 years of....",
caption: "Product Name: Awesome Pix-X",
quote:"Quote: You will always be mine!"
},
function (response)
{
if (response && !response.error_message) {
alert('post_id : ' + response.post_id);
} else {
alert('Error while posting.');
}
});
}
So Do I add a query parameter in here to dynamically get facebook user who clicks on it?
link: "https://mygallery.net/Product/Details/99",
If the user did not authorize your App, there is no way to know. If he authorized your App, you can get his id with FB.getLoginStatus, for example.
I am using a Facebook social plugin share button, I want to capture the event whether the user shares the event or not.
Is there a way to check whether the user shared it or not using plugin only?
Using the FB.ui method provided by the Facebook JavaScript SDK, you can pass a callback as the second argument and check for the post_id on the response object.
FB.ui({
method: 'feed',
link: 'http://www.example.org/',
picture: 'http://placehold.it/400x400',
caption: 'Title',
description: 'Some description...'
}, function (response) {
if (response.post_id) {
// This post was shared
} else {
// This post was not shared
}
});
More information can be found in the Facebook share documentation.
Using Facebook's JavaScript SDK I am trying to open a share dialog from within a canvas app, which I am able to do fine. However, when I try to amend the message that gets sent along with it, I'm unable to get things working.
I'm aware I can change the message using meta tags within the document itself, as Facebook scrapes the page on the link to grab og:* tags from the head of the doc, but the message I want to share is specific to this user's experience, for example: "I just scores 9/10 on this quiz, can you do any better?".
I have set up an action, object and story, which are being linked in fine. Below is my code, which isn't changing the message:
FB.ui({
method: 'share_open_graph',
action_type: 'the-dog-breed-quiz:take',
action_properties: JSON.stringify({
quiz:'https://apps.facebook.com/removed',
message: 'I scored 15 out of a possible 20 on the Test quiz. Can you do any better?'
})
}, function(response){});
After much searching and piecing things together I have the following solution.
The process is thus:
Have a button to be clicked. This is a must, as you'll need to provide proof of user interaction in order to show a dialog.
Ensure you have publish_actions permission at point of login
Create a user action. I did this using JS SDK, see below code.
Take the ID from the user action and reference that as part of the UI call
.
FB.api(
'me/objects/your-app-namespace:quiz',
'post',
{'object': {
'og:title': 'Blah blah',
'og:type': 'your-app-namespace:quiz',
'og:image': 'https://fbstatic-a.akamaihd.net/images/devsite/attachment_blank.png',
'og:description': 'keyboard mashdfhg nfkg kfd hg',
'fb:app_id': 'removed'
}},
function(response) {
// handle the response
FB.ui({
method: 'share_open_graph',
action_type: 'your-app-namespace:take',
action_properties: JSON.stringify({
quiz:response.id,
})
}, function(response){
console.log(response);
});
}
);
I have a page tab and want to allow users to share some content in their wall, friends wall or by a private message to a friend.
I'm currently using:
function postToFeed() {
// calling the API ...
var obj = {
method: 'feed',
link: 'page url',
picture: 'image url',
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);
}
This works fine but only allows to share in my wall.
So the question is... Is there any dialog or way to allow the three features on the same dialog?
I saw 'send' dialog to send a private message but couldn't find the share on friend wall dialog.
Ideally I wanted to have only a share button and allow the three options after clicking.
Any idea?
Thanks
For the stumblers there isn't a proper official way to do this. However it's still possible to implement it by using the sharer.php technique
https://stackoverflow.com/a/12799020/691553
Cheers
You can use the Feed dialog to share on a friend’s wall, if you provide the to parameter.
To get a userid to send “to” before opening the dialog, you could implement your own friend selector in the way described here: https://developers.facebook.com/docs/guides/games/custom-muti-friend-selector/