I am fetching the wall post from my FB page using Javascript API as below.
$(document).ready(function(){
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxxxxxxxx',
xfbml : true,
version : 'v2.1'
});
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
//console.log('Logged in.');
}
else {
FB.login(function(response) {
if (response.authResponse) {
var access_token = FB.getAuthResponse()['accessToken'];
console.log(response);
FB.api('/153466xxxxxxxx/posts', function(response) {
console.log(response);
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: ''});
}
});
};
(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/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
});
however, this needs the user to login and allow permissions to the app. Is it possible for me, using PHP FB SDK, to fetch the wall post from my account ONLY and show it on my webpage without asking the users to login to their Fb account.
Any help will be appreciated.
For a Facebook Page it´s quite easy, all you need is an App Access Token:
https://developers.facebook.com/docs/facebook-login/access-tokens/
http://www.devils-heaven.com/facebook-access-tokens/
The Facebook SDKs will use an App Token automatically if no user is logged in, but you can also just add the Access Token. Be careful though, don´t use the easy way to create an App token, which is just a combination of App ID and App Secret:
var accesstoken = APPID + '|' + APPSECRET;
Now if you use that one on the client with JavaScript, your App Secret will be visible to everyone, which is very bad. I would suggest using PHP for this, either with the PHP SDK or simple CURL calls. If you really want to use JavaScript only, just visit the first link i posted and check out how to generate an App Token with a Graph API call:
GET /oauth/access_token?
client_id={app-id}
&client_secret={app-secret}
&grant_type=client_credentials
For a User Profile it´s a lot harder, because you do need a User Token for that. And even an Extended User Token is only valid for 60 days. After that, you need to refresh it manually. But User Profiles should not be used for that anyway.
Related
I have the following elements:
a facebook account
an App set up in developers.facebook.com (and added it to my user)
my own website on my server
In my website I implement via Javascript
(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_GB/sdk.js';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
FB.init({
appId: 'XXXXX', // here my App Id
cookie: true,
xfbml: true,
version: 'v2.9'
});
FB.AppEvents.logPageView();
};
That works fine and I can eg make calls like
FB.getLoginStatus(function(r) {
if(r.status === 'connected') {
FB.api('/ZZZZZ/campaigns',function(response) {
// do something!
console.log(response); // (§)
});
}
});
I get the following output at (§):
{"error":{"message":"Unsupported get request. Object with ID 'ZZZZZ' does not exist, cannot be loaded due to missing permissions, or does not support this operation. Please read the Graph API documentation at https://developers.facebook.com/docs/graph-api","type":"GraphMethodException","code":100,“fbtrace_id":“#########"}}
Here XXXX = my App Id, and ZZZZZ = my Business Account Id. They all definitely exist! And as the user that set it all up, my up until that stage logged in user should have all the necessary permissions.
What is going on? How do I make this work?
If you know, please try to provide me concrete code. (All the guides online that I have found are frustratingly vague, which is the reason I am posting this question here.) Thanks in advance!
Further Question: does //connect.facebook.net/.../sdk.js suffice in geneneral to interface with Business Manager via my Api? Or Do I need to download this strange Javascript API SDK und use require, and all that horribly messy stuff?
I am working on putting Facebook login on my site. I'm not a very strong javascript coder, but usually find the code I need and, after some work and trial and error, get the results I need.
I got the login script working and the only thing I need (I think--remember javascript isnt my strong point so maybe you see some flaws here that I don't) is to obtain the email address from the login call. I have added 'email' to the scope and tried to access email from the response object as well as the user object. I know that email is valid because I am testing with my FB account and it was validated with email, not phone. But it comes up as undefined.
You'll see the spot where I am trying to get it in the myfacebooklogin function.
Anyone know how/why I cant access the email?
Also, does this code look solid?
Lastly, how would you best handle the session/state? In ASP (what the site is coded in--classic, not .NET) I use the session object if the person logged in traditionally. If they log out, I just set the session variable to "".But with this, would you just authenticate every page and use that as the session, or would you use the FB login to create an ASP session and use that?
Below is all of the code. The only other pieces are in the HTML body--a button to the myfacebooklogin function and a div that gets written to (which was part of the code I found so I left it in).
Thanks!
<script>
// Load the SDK asynchronously
(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/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
FB.init({
appId : 'myAppId',
cookie : true, // enable cookies to allow the server to access
// the session
xfbml : true, // parse social plugins on this page
version : 'v2.8' // use graph api version 2.8
});
// Now that we've initialized the JavaScript SDK, we call
// FB.getLoginStatus(). This function gets the state of the
// person visiting this page and can return one of three states to
// the callback you provide. They can be:
//
// 1. Logged into your app ('connected')
// 2. Logged into Facebook, but not your app ('not_authorized')
// 3. Not logged into Facebook and can't tell if they are logged into
// your app or not.
//
// These three cases are handled in the callback function.
//second parameter of FB.getLoginStatus is "true" to force a roundtrip to FB.
//if "true" not set, result will come from cache
//set "true" only when needed to save performance (for example, on login page)
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
},true);
};
// This is called with the results from from FB.getLoginStatus().
function statusChangeCallback(response) {
console.log('statusChangeCallback');
console.log(response);
// The response object is returned with a status field that lets the
// app know the current login status of the person.
// Full docs on the response object can be found in the documentation
// for FB.getLoginStatus().
if (response.status === 'connected') {
// Logged into your app and Facebook.
//testAPI();
alert('1');
} else if (response.status === 'not_authorized') {
// The person is logged into Facebook, but not your app.
document.getElementById('status').innerHTML = 'Please log ' +
'into this app.';
alert('2');
} else {
// The person is not logged into Facebook, so we're not sure if
// they are logged into this app or not.
document.getElementById('status').innerHTML = 'Please log ' +
'into Facebook.';
alert('3');
}
}
function myFacebookLogin() {
FB.login(function(response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
alert(response.name);
alert(response.id);
//alert(response.mail);
});
// FB.api('/me', function(user) {
// console.log(user.name + ': ' + user.email);
// alert(user.email);
// });
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'public_profile, email', return_scopes: true}); //scope: 'publish_actions'
}
</script>
You need pass the fields in the url "/me" like:
FB.api('/me?fields=name,id,email', function(response) {
I want to do is get basic information about a FB Page (total page likes, posts posted by the page). Using the Facebook Javascript SDK I am running into problems.
window.fbAsyncInit = function() {
FB.init({
appId: '12345', //My app id
xfbml: true,
version: 'v2.5'
});
/* make the API call */
FB.api(
"/128155725517",
'GET',
// {"fields":"id,name"},
function(response) {
if (response && !response.error) {
console.log(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/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
And the response I get is:
/**/ FB.__globalCallbacks.f1084b047c({"error":{"message":"An access token is required to request this resource.","type":"OAuthException","code":104,"fbtrace_id":"HUcIot7YeoH"}});
My question is this: Can I request from the Graph API WITHOUT a user access token? Do they have to log in to get an access token for me to read info from the Graph API? Can I create a token that will always work, no matter if the website visitor is logged into FB?
Thanks in advance.
Without login, you can only use an "App Access Token". It is just a combination of App ID and App Secret - but you should never use it in client code, of course. If the Page is restricted by age or location, you need to use a User Token or Page Token.
More information about Tokens and how to generate them:
https://developers.facebook.com/docs/facebook-login/access-tokens
http://www.devils-heaven.com/facebook-access-tokens/
So I am trying to add Facebook Login to my page but I am having some difficulties. I am trying to figure out how to test these features in development before I go to production but I don't completely understand how to do that.
I have followed the facebook api instructions so I think I have something that should work but I can't test. That code is below:
<script>
function fb_login() {
FB.login( function() {}, { scope: 'email,public_profile' } );
}
// This is called with the results from from FB.getLoginStatus().
function statusChangeCallback(response) {
console.log('statusChangeCallback');
console.log(response);
// The response object is returned with a status field that lets the
// app know the current login status of the person.
// Full docs on the response object can be found in the documentation
// for FB.getLoginStatus().
if (response.status === 'connected') {
// Logged into your app and Facebook.
testAPI();
} else if (response.status === 'not_authorized') {
// The person is logged into Facebook, but not your app.
document.getElementById('status').innerHTML = 'Please log ' +
'into this app.';
} else {
// The person is not logged into Facebook, so we're not sure if
// they are logged into this app or not.
document.getElementById('status').innerHTML = 'Please log ' +
'into Facebook.';
}
}
// This function is called when someone finishes with the Login
// Button. See the onlogin handler attached to it in the sample
// code below.
function checkLoginState() {
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
window.fbAsyncInit = function() {
FB.init({
appId : '************',
cookie : true, // enable cookies to allow the server to access
// the session
xfbml : true, // parse social plugins on this page
version : 'v2.2' // use version 2.2
});
// Now that we've initialized the JavaScript SDK, we call
// FB.getLoginStatus(). This function gets the state of the
// person visiting this page and can return one of three states to
// the callback you provide. They can be:
//
// 1. Logged into your app ('connected')
// 2. Logged into Facebook, but not your app ('not_authorized')
// 3. Not logged into Facebook and can't tell if they are logged into
// your app or not.
//
// These three cases are handled in the callback function.
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
};
// Load the SDK asynchronously
(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/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
// Here we run a very simple test of the Graph API after login is
// successful. See statusChangeCallback() for when this call is made.
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Successful login for: ' + response.name);
document.getElementById('status').innerHTML =
'Thanks for logging in, ' + response.name + '!';
});
}
</script>
My App ID is correct in my application.
Here is my login button:
<img src="../../static/textchange/facebookloginbutton.png" border="0" alt="" height="42px;">
</div>
I made my own so I could choose another image.
So now when I try to login I get this error:
"Given URL is not allowed by the Application configuration: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains."
So I believe I have to choose another domain of some sort to test it? But I don't understand what I am supposed to choose? Do I have to start "hosting" so I can use a real domain? Can I do it locally?
I would appreciate any help in pushing me in the right direction.
Thanks.
You can configure your Valid OAuth redirect URIs under Client OAuth Settings in the Facebook Developers dashboard to allow whatever URL you are using locally. Or set the site URL to use your local URL.
your site URL should be http://localhost:8000/. I think the http:// matters
$scope.login = function() {
FB.login(function(resp) {
var args = { signed_request: resp.authResponse.signedRequest };
$http.get('/auth/facebook/callback', args).then(function(resp) {
// handle success
});
}, {scope: 'email,user_friends,user_location'});
};
Is something like this possible?
I have a client launching an online magazine for his business. He wants to add a facebook like button (for the magazine fanpage) on his current corporate site and ask users to 'like it' in order to be taken to the magazine website. Can it be done? Are there drawbacks to this approach? For example, the same user will have to 'like it' every time they want to access the magazine site?
Thank you for any suggestion, I'm pretty new to facebook.
You can redirect a user on clicking a like button using the Javascript SDK and FB.Event.Subscribe
FB.Event.subscribe('edge.create', function(response) {
window.parent.location = 'http://www.google.com';
});
edge.create is called when ever a user likes something on the page
response is the url that has just been liked.
If there are multiple like buttons on the page you could use an if statement with the response to make sure the page only redirects for a particular like button
Here's the full javascript code and a like button
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
FB.Event.subscribe('edge.create', function(response) {
window.parent.location = 'http://www.google.com';
});
};
// 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/<?php if(isset($fb_user['locale'])){echo $fb_user['locale'];}else{echo'en_US';}?>/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<fb:like href="http://www.google.com" send="false" width="450" show_faces="true"></fb:like>