Facebook Feed Dialog does not open - facebook

I am building a custom multi friend selector in order to send posts to friend's walls on Facebook based on this tutorial
https://developers.facebook.com/docs/guides/games/custom-muti-friend-selector/
I have been able to load my list of friends and create a CSV list of people I want to post to but the last step of opening the feed dialog is failing and I don't understand why. The dialog does not open.
this is my sendRequest function
var sendUIDs = '';
$('.cbFriendId').each(function(index){
if($(this).prop('checked') == true){
var addId = $(this).attr('value');
sendUIDs += addId + ',';
}
});
console.log(sendUIDs);
openSendDialog(sendUIDs);
}
function openSendDialog(sendUIDs){
console.log('open send dialog');
FB.ui({
method: 'feed',
to: sendUIDs,
link: 'http://www.mydomain.com',
display: 'iframe',
message: 'Hello from My Domain',
name: 'Click to view my app',
caption: 'Hello my app'
},
function (response) {
if (response) {
alert('Post was published.');
console.log('Post was published.');
} else {
alert('Post was not published.');
console.log('Post was not published.');
}
}
);
}
The last console log entry is 'open send dialog'. I get no errors in IE9 dev tools but I do get an 'Unsafe Javascript attempt to access frame ...' error in chrome.
just for sanity sake here is my graph init
window.fbAsyncInit = function () {
FB.init({
appId: '462750593765445', // App ID
channelUrl: '//www.mydomain.com/channel.html', // Channel File
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true, // parse XFBML
frictionlessRequests: false
});
};
Also I should mention that the app is in sandbox mode.
Thanks for the help

What you're trying to do is called Send Dialog, So you need to change your method from feed to send and it should work.
Check out their docs for more information: https://developers.facebook.com/docs/reference/dialogs/send/

Related

Trouble with facebook sdk quickstart

Following directions here https://developers.facebook.com/docs/javascript/quickstart
I started with a mostly blank HTML page, just the HTML, Body tags, and a simple Hello World.
I copied and pasted directly from the quickstart page but get nothing (but Hello World does Load).
I have an app ID (I wasn't sure if I should include the {} or not, tried both ways, no change.
I added the code from section "Using the SDK to add Social Plugins", "Using the SDK to trigger a Feed dialog" etc and nothing. Running on CentOS/Apache, server is fine. Not sure what I'm missing. Thoughts?
Thank you for your time.
PS page is here to view source: http://nex916.elementfx.com/purity3.html
Maybe something like the following will be of help?
<div id="fb-root"></div>
<!-- Load the Facebook JavaScript SDK -->
<script src="//connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
// Initialize the Facebook JavaScript SDK
FB.init({
appId: 'YOUR_APP_ID',
xfbml: true,
status: true,
cookie: true,
});
// Check if the current user is logged in and has authorized the app
FB.getLoginStatus(checkLoginStatus);
// Login in the current user via Facebook and ask for email permission
function authUser() {
FB.login(checkLoginStatus, {scope:'email'});
}
// Check the result of the user status and display login button if necessary
function checkLoginStatus(response) {
if(response && response.status == 'connected') {
//alert('User is authorized');
// Hide the login button
document.getElementById('loginButton').style.display = 'none';
// Now Personalize the User Experience
//console.log('Access Token: ' + response.authResponse.accessToken);
} else {
//alert('User is not authorized');
// Display the login button
document.getElementById('loginButton').style.display = 'block';
}
}
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\'s identity, ' +
'social graph and distribution power to your site.'
),
link: 'https://developers.facebook.com/docs/reference/javascript/',
picture: 'http://www.fbrell.com/public/f8.jpg'
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
</script>
<input id="loginButton" type="button" value="Ligin with Facebook" onclick="authUser();" /></div>
<div class="fb-like" data-send="true" data-width="450" data-show-faces="true"></div>
You have a syntax error in your JS
SyntaxError: syntax error purity2.html:26
To fix it, remove }; from line 19
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
console.log('Logged in');
} else {
FB.login();
}
});
}; // this
it should be like
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
console.log('Logged in');
} else {
FB.login();
}
});
Now your code should work

Cakephp Facebook Plugin - Sharing through an action

I am using Nick Baker's (webtechnick) CakePHP / Facebook plugin which is awesome and works great, however I have a question that I can't seem to even come close to answer for.
How would I bypass the use of a share button and share directly through an action?
For instance, I make a post through my site and the post adds to the DB as it should, it also shoots a post to the logged in users Twitter account through the action. How can I also have this action handle sharing it to my FB account (connection has already been made).? I tried the first thing I think anyone would obviously try $this->Facebook->share() directly in the action, too no avail...
Any thoughts or solutions would be of great help...
UPDATE AFTER ANSWER
Thx for the help spooney. I voted your answer up because you are 100% spot on from what I can tell. I am loading the JS SDK.
function init($options = null, $reload = true) {
if (empty($options)) {
$options = array();
}
if ($appId = FacebookInfo::getConfig('appId')) {
$session = json_encode($this->Session->read('FB.Session'));
if ($reload) {
$callback = "FB.Event.subscribe('auth.login',function(){window.location.reload()});";
} else {
$callback = "if(typeof(facebookReady)=='function'){facebookReady()}";
}
$callback .= "FB.Event.subscribe('auth.logout',function() {window.location = '/bastards/users/logout'});";
$init = '<div id="fb-root"></div>';
$init .= $this->Html->scriptBlock(
<<<JS
window.fbAsyncInit = function() {
FB.init({
appId : '{$appId}',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
oauth : true // use Oauth
});
{$callback}
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/{$this->locale}/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
JS
, $options);
return $init;
} else {
return "<span class='error'>No Facebook configuration detected. Please add the facebook configuration file to your config folder.</span>";
}
}
I have no problem pulling in the user information and working with all that. I have accomplished posting to FB from my site, but it was only through a link, using FB.ui...
<br><font style="color:#FFF; text-decoration:none;padding-left:27px;">post to wall</font><br>
<script>
function publishStory() {
FB.ui({
method: 'feed',
name: 'message name',
caption: 'message caption ',
description: 'description goes here',
link: 'the url current page',
picture: 'if you want to add an image'
},
function(response) {
console.log('publishStory response: ', response);
});
return false;
}
</script>
I have tried replacing the code above with...
<br><font style="color:#FFF; text-decoration:none;padding-left:27px;">post to wall</font><br>
<script>
function publishStory() {
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);
}
});
}
</script>
But it errors everytime.
I should also throw in there that the post on the users FB wall isn't really coming from the site persay, it's a post from the user on their own wall basically stating, "I made a post on ladala.com, you should go check it out at ."
So now I'm at the point that I need to figure out how to run FB.ui through the action that submits the post.
Based on our conversation, I figured I would just put a more complete description in an answer.
You can fire a share call using the JavaScript SDK.
First, you would need to load the JavaScript SDK as described in the Loading section of https://developers.facebook.com/docs/reference/javascript/.
Once loaded into your page, the two calls you want to look at are FB.getLoginStatus, and FB.api. FB.getLoginStatus will give you back a response telling you if the user is logged in to facebook, and if they have approved your application. This link will describe the functionality of getLoginStatus, but in short, you need to check for response.connected(and then possibly do another call to confirm a user's permissions, if required).
If the user is logged in and has approved your app, you can then attempt to make an API call using FB.api. Keep in mind to do this, you will likely need the user to have allowed the publish_stream permission.
Your code would look something like this:
//Do FB initialization
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
FB.api('/me/feed', 'post', { message: body }, function(response) {
if (!response || response.error) {
//Post was successful
}
});
}
});
This can be triggered any way you want. On page load, on click, on completion of some other event, etc.
Keep in mind this is just one way to implement this. Also, if you are trying to share something with your FB application, and it is not working, you should confirm that you have all the permissions required to do so.

Facebook wall post response is blank screen in webview stuck in XD_proxy.php

I'm trying to post on facebook wall from Webview, its showing popup
to share content but after cancel or post it doesn't get back to
home share screen or unable to dispose popup window. The same
implementation is working fine in Browser, but not working in
Webview.
After sharing or cancel it should get back to share screen, but it
doesn't get back to the share screen and stuck in XD_proxy.php auth
link of facebook
Here's my code.
window.fbAsyncInit = function() {
FB.init({appId: "App_id", status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement("script"); e.async = true;
e.src = document.location.protocol + "//connect.facebook.net/en_US/all.js";
document.getElementById("fb-root").appendChild(e);
}());
function streamPublish() {
FB.ui(
{
method: 'stream-publish',
display: 'iframe',
message: 'getting educated about Facebook Connect',
name: 'Connect',
caption: 'The Facebook Connect JavaScript SDK',
description: (
'A small JavaScript library that allows you to harness ' +
'the power of Facebook, bringing the user\'s identity, ' +
'social graph and distribution power to your site.'
),
link: 'http://www.fbrell.com/',
picture: 'http://www.fbrell.com/f8.jpg',
actions: [
{ name: 'fbrell', link: 'http://www.fbrell.com/' }
],
user_message_prompt: 'Share your thoughts about RELL'
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
}

Publish to Current user's wall using FBJS in FBML application

I need to publish some message to the current user's wall using FBJS in FBML application.
When I use
window.fbAsyncInit = function() {
FB.init({appId: 'MY_APP_ID', status: true, cookie: true, xfbml: false});
};
i am getting an error :- FB is not defined.
and
window is not defined.
For publishing i am using this code
function graphStreamPublish(){
var body = document.getElementById("txtTextToPublish").value;
FB.api('/me/feed', 'post', { message: body }, function(response) {
if (!response || response.error) {
// alert('Error occured');
} else {
// alert('Post ID: ' + response.id);
}
});
}
(I cannot use alert in facebook..)
Thanks in advance..
If you're using FBML, you should be using FBJS instead of the Facebook Connect API.
var body = document.getElementById('txtTextToPublish').getValue();
Facebook.streamPublish(body);
Note the getValue() call instead of .value due to use of FBJS.

Facebook code to prompt for stream publish with in application

I have a bit confusion using facebook API. I am using a code that is working out side of facebook but not in facebook application canvas page.
I have bit idea but not sure. Can anybody let me know the reason behind this and the code that will run in facebook application.
What is difference you run code using application like
http://apps.facebook.com/exampleAPP/test.php
or normal url
http://www. example.com/example/test.php
http://www. example.com/example/ is the canvas URL
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : '115454544334343454',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.ui(
{
method: 'stream.publish',
attachment: {
name: 'JSSDK',
caption: 'The Facebook JavaScript SDK',
description: (
'A small JavaScript library that allows you to harness ' +
'the power of Facebook, bringing the user\'s identity, ' +
'social graph and distribution power to your site.'
),
href: 'http://fbrell.com/'
},
action_links: [
{ text: 'fbrell', href: 'http://fbrell.com/' }
]
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
</script>
I'm fairly sure stream.publish is deprecated and unsupported. What you want instead is the Feed dialog.