I know this can't be that difficult; maybe I'm going about this the wrong way. Hopefully you can help me.
I have a website that needs to be able to post a string to someone's Facebook timeline.
I've gotten them to login properly, but I haven't found any working code to submit information to their timeline after they've given permission.
I've followed the example here with no luck. I've
Created an App
Logged into Facebook
Defined a Cook action with a recipe object
Created a page on my website with the code that they provided, replacing [your_app_id] with my app id
Attempted to post a cook action
But when I click the cook button on their sample page on my site, it gives me the error:
No callback passed to the ApiClient for https://graph.facebook.com/me/fblaevents:cook
and the error occurred browser alert pops up.
Here is the sample code that I'm using:
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head prefix="og: http://ogp.me/ns# fblaevents:
http://ogp.me/ns/apps/fblaevents#">
<title>OG Tutorial App</title>
<meta property="fb:app_id" content="542182755801091" />
<meta property="og:type" content="fblaevents:recipe" />
<meta property="og:title" content="Stuffed Cookies" />
<meta property="og:image" content="http://fbwerks.com:8000/zhen/cookie.jpg" />
<meta property="og:description" content="The Turducken of Cookies" />
<meta property="og:url" content="http://fbwerks.com:8000/zhen/cookie.html">
<script type="text/javascript">
function postCook()
{
FB.api(
'/me/fblaevents:cook',
'post',
{ recipe: 'http://fbwerks.com:8000/zhen/cookie.html' },
function(response) {
if (!response || response.error) {
alert('Error occured');
} else {
alert('Cook was successful! Action ID: ' + response.id);
}
});
}
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '542182755801091', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<h3>Stuffed Cookies</h3>
<p>
<img title="Stuffed Cookies"
src="http://fbwerks.com:8000/zhen/cookie.jpg"
width="550"/>
</p>
<br>
<form>
<input type="button" value="Cook" onclick="postCook()" />
</form>
</body>
</html>
If there is an easier way, please point it out to me. I don't know what I'm doing.
You should replace the OG meta tags and the recipe url in your JS code with your own. As the above code is a starting code only, not a working demo (or maybe it was but now the links are dead).
Also since you are getting Error occured then most probably response.error has something in it, so you should check its value by calling the console method for example:
if (!response || response.error) {
console.log('Error occured: ', response.error);
} else {
This would give you:
Error occured: Object {type: "Exception", message: "Could not
retrieve data from URL.", code: 1660002}
Related
UPDATED.
This code block takes the users facebook connections and saves them into the "fbdata" and within the div "friends-list-container".
Here is the page with the error.
I'm then attempting to save the data to parse.com and have the following error shown the image below.
<!doctype html>
<!-- Runs Parse and FB code that uses Facebook authentication to login
user to the site and redirects them to the main content area. This page is
fired from the Facebook button being clicked on the site landing page-->
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="fresh Gray Bootstrap 3.0 Responsive Theme "/>
<meta name="keywords" content="Template, Theme, web, html5, css3, Bootstrap,Bootstrap 3.0 Responsive Login" />
<meta name="author" content="Adsays"/>
<title>Parse JavaScript Todo App</title>
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script src="scripts/underscore-1.1.6.js"></script>
<script src="http://www.parsecdn.com/js/parse-1.2.13.min.js"></script>
</head>
<body>
<!-- Important, must be on the page -->
<div id="fb-root"></div>
<!-- Initialize the Parse object-->
<script type="text/javascript">
Parse.initialize("79tphN5KrDXdjJnAmehgBHgOjgE2dLGTvEPR9pEJ", "9lblofQNZlypAtveU4i4IzEpaOqtBgMcmuU1AE6Y");
var user = Parse.User.current();
//Fb app information//
window.fbAsyncInit = function() {
Parse.FacebookUtils.init({
appId : '523753101076577',
channelUrl : 'http://www.kudosoo.com/channel.html',
status : true,
cookie : true,
xfbml : true
});
//FB user authentication script, after this completes it fires todos_two.js to redirect user to main content page//
FB.getLoginStatus(function (response) {
if (response.status === 'connected') {
FB.api('/me/friends', function(response){
if (response && response.data){
var contact = new Parse.User();
var fbdata=response.data;
var divTarget=document.getElementById("friends-list-container");
for (var friendIndex=0; friendIndex<fbdata.length; friendIndex++)
{ var divContainer = document.createElement("div");
divContainer.innerHTML="<b>" + fbdata[friendIndex].name + "</b>";
divTarget.appendChild(divContainer);
}
var contact = new Parse.User();
var contact = new Contact();
$(document).ready(function () {
var username = $("#friends-list-container").val();
contact.set("facebookFriends", fbdata.toString());
contact.save(null, {
success: function (results) {
// The object was saved successfully.
location.reload();
},
error: function (contact, error) {
// The save failed.
// error is a Parse.Error with an error code and description.
alert("Error: " + error.code + " " + error.message);
}
});
});
} else {
console.log('Something goes wrong', response);
}
});
}
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div id="friends-list-container"></div>
</body>
</html>
Here is the error.
Try replacing this line:
var contact = Parse.Object.extend("_User");
Updated from the chat conversation, this is what solved the problem:
If you want to store the friends list in an array on the current user, then Parse.User.current() is what you want:
var contact = Parse.User.current()
So i'm curious to know how to write some code to make the Facebook "Likes" appear on the users timeline, activity feed and in their "Liked pages section". As of today im using the following code:
<meta property="fb:app_id" content="APP_ID" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://MY_URL.SE/" />
<meta property="og:image" content="http://MY_URL.SE/med/fbLike.png" />
<meta property="og:title" content="SITE_TITLE" />
<meta property="og:site_name" content="SITE_NAME" />
<meta property="og:description" content="DESCRIPTION" />
And the javascript for the Facebook Like button:
var fbAppId = 'APP_ID';
var objectToLike = 'https://MY_URL.SE';
window.fbAsyncInit = function() {
FB.init({
appId : APP_ID,
status : true,
cookie : true,
xfbml : true
});
};
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/sv_SE/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function postLike() {
FB.api(
'https://graph.facebook.com/me/og.likes',
'post',
{ object: objectToLike,
privacy: {'value': 'SELF'} },
function(response) {
if (!response) {
alert('Error occurred.');
} else if (response.error) {
document.getElementById('result').innerHTML = 'Error: ' + response.error.message;
} else {
document.getElementById('result').innerHTML =
'<a href=\"https://www.facebook.com/me/activity/' + response.id + '\" />';
}
}
);
}
The like counter is increasing/decreasing as intended but nothing is being displayed on Facebook. The debugger tool finds all the OG objects and doesn't report any errors. The app is live and sandbox mode is deactivated, the Feed Dialog is working as intended (using the same app).
So why isn't it sharing the likes on the timeline/activity feed? Did i miss something?
have you tried going to your facebook profile and clicking on the "activity log" It lists all your activity whether its shared on your timeline or not. I've found on a site I'm currently working on that the activity is shown there and in order to get it on my timeline I have to select that from the drop down next to the post in the activity log.
THis is a very newbie question about facebook open graph. I did the tutorial and have no problem create new namespace with new verbs and new nouns. However, I can't get a simple LIKE an OBJECT to work...
Anyway, here's the result of everything i'm doing.
I am getting the following error when I try to execute a custom built-in like with facebook's open graph:
Object
error: Object
code: 1611072
message: "The action you're trying to publish is invalid because it does not specify any reference objects. At least one of the following properties must be specified: object."
type: "Exception"
__proto__: Object
__proto__: Object
Here is my code:
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
<title>OG Tutorial App</title>
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# object: http://ogp.me/ns/object#">
<meta property="fb:app_id" content="99999999999" />
<meta property="og:type" content="object" />
<meta property="og:url" content="http://jl.com/" />
<meta property="og:title" content="Sample Object" />
<meta property="og:image" content="https://s-static.ak.fbcdn.net/images/devsite/attachment_blank.png" />
</head>
<body>
<div id="fb-root"></div>
<script type="text/javascript">
function postbake()
{
FB.api(
'/me/og.likes',
'post',
{ recipe: 'http://jl.com/' },
function(response) {
if (!response || response.error) {
alert('Error occured');
console.log(response);
} else {
alert('bake was successful! Action ID: ' + response.id);
}
});
}
</script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '999999999999', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<fb:login-button show-faces="true" width="200" max-rows="1" scope="publish_actions">
</fb:login-button>
<input type="button" onclick="postbake()" value="like it" />
</body>
</html>
message: "The action you're trying to publish is invalid because it does not specify any reference objects. At least one of the following properties must be specified: object."
You are trying to post your object to like as recipe – but the parameter name has to be object instead …
Hello everyone I'm trying to post the activity of users of my facebook app, I follow the tutorial step by step but it doesn't work properly...
The alert message show me the error "Error occured An active access token must be used to query information about the current user" why?? I'm loged correctly.
The code is this:
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head prefix="og: http://ogp.me/ns# appnamespace:
http://ogp.me/ns/apps/appnamespace#">
<title>OG Tutorial App</title>
<meta property="fb:app_id" content="appID" />
<meta property="og:type" content="appnamespace:recipe" />
<meta property="og:title" content="Stuffed Cookies" />
<meta property="og:image" content="http://www.domain.com/logo.gif" />
<meta property="og:description" content="The Turducken of Cookies" />
<meta property="og:url" content="http://www.domain.com/activity.php">
<script type="text/javascript">
function postCook()
{
FB.api(
'/me/namespace:cook',
'post',
{ recipe: 'http://www.domain.com/activity.php' },
function(response) {
if (!response || response.error) {
alert('Error occured '+ response.error.message); // it shows "Error occured An active access token must be used to query information about the current user." message
} else {
alert('Cook was successful! Action ID: ' + response.id);
}
});
}
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'appID', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<h3>Stuffed Cookies</h3>
<p>
<img title="Stuffed Cookies"
src="http://www.domain.com/logo.gif"
/>
</p>
<br>
<form>
<input type="button" value="Cook" onclick="postCook()" />
</form>
</body>
</html>
I don't see anywhere in your source where you authenticate the user. The user must authorize your application first, as described here: https://developers.facebook.com/docs/authentication/client-side/
I have this code I got it from facebook developers and when I click on button read I have problem always return this message to me (error occured):
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head prefix="og: http://ogp.me/ns# subhinajjar:
http://ogp.me/ns/apps/subhinajjar#">
<title>OG Tutorial App</title>
<meta property="fb:app_id" content="*****" />
<meta property="og:type" content="subhinajjar:article" />
<meta property="og:title" content="3eesho reading club" />
<meta property="og:url" content=document.location.href>
<script type="text/javascript">
function postarticle()
{
FB.api(
'/me/subhinajjar:read?article',
'post',
{ article: 'document.location.href' },
function(response) {
if (!response || response.error) {
alert('Error occured');
} else {
alert('read was successful! Action ID: ' + response.id);
}
});
}
</script>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '*****', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
</p>
<br>
<form>
<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="1" scope="publish_action"></div>
<input type="button" value="read" onclick="postarticle()" />
It always return this message (error occured) why?
And what does function response mean?
You should parse the response.error or log it to the console.
On first glance /me/subhinajjar:read?article should be /me/news.reads
And <meta property="og:type" content="subhinajjar:article" />
Should be <meta property="og:type" content="article">
So most likely the error is
Unknown path components