I'm trying really hard to learn how to do this but I keep running into problems.
FB.ui works for posting but every time I use FB.api it comes up as undefined and I get a random picture. What am I doing wrong?
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'numbers', // App ID
channelUrl : '/channel.php', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.api('/me', function(user) {
if (user) {
var image = document.getElementById('image');
image.src = 'https://graph.facebook.com/' + user.id + '/picture';
var name = document.getElementById('name');
name.innerHTML = user.name
}
});
};
// 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/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div align="center">
<img id="image"/>
<div id="name"></div>
</div>
You need to call FB.login before making the API call. I guess, thats what you are missing.
Related
I would like, as a javascript newbie, update Facebook's customer chat plugin with some custom parameter in the ref field (actually cookie of the user to which I show the plugin). I cannot seem to be able to override the default that I set. Why is that? I've been stuck on this forever. I always receive the ref parameter default_ref.
Any help will be appreciated. Thanks
<!DOCTYPE html>
<head>
</head>
<script>
function updateRef(){
console.log("updating ref");
document.getElementById("chat").ref="update_ref";
console.log("tried to update ref;")
}
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxx',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.0'
});
};
(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 = "https://connect.facebook.net/cs_CZ/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
console.log("customer chatloading");
document.getElementById("chat").ref = "test_work_please";
console.log("finished loading chat");
console.log("ref is " + document.getElementById("chat").ref);
</script>
<body>
<div id="chat" class="fb-customerchat"
messenger_app_id="xxxxxxxxxx"
logged_in_greeting="yyyyyyy
logged_out_greeting="zzzzz"
greeting_dialog_display="fade"
ref="default_ref"
page_id="xxxxxxxxxxxx">
</div>
</body>
I need to build a page that when loaded logs out automatically the user from facebook
i tried this code
window.fbAsyncInit = function() {
FB.init({
appId : 'abc123456789',
xfbml : false,
version : 'v2.7',
status : true
});
FB.logout();
};
(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'));
but it does not work. It seems that when FB.logout() is called, the FB api doesn't know the user's session.
If I call FB.logout() after an arbitrary period of time
setTimeout(function(){
FB.logout();
}, 3000);
It works.
Is there a way to know when the user information loading has been completed?
Use FB.getLoginStatus to check if the user is logged in. It should work to call FB.logout in the callback function of FB.getLoginStatus: https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus
For example:
FB.init({
appId : 'abc123456789',
xfbml : false,
version : 'v2.7',
status : true
});
FB.getLoginStatus((response) => {
if (response.status === 'connected') {
FB.logout();
}
}, true);
This is facebook share button code from facebook
<div id="fb-root"></div>
<script>(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#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<!-- Your share button code -->
<div class="fb-share-button"
data-href="http://www.your-domain.com/your-page.html"
data-layout="button_count">
</div>
How can I get response of success or error from this?
I tried some examples but didn't got response after sharing via code.
Share button works and it also sharing the post.
window.fbAsyncInit = function() {
// init the FB JS SDK
FB.init({
appId : '1743496239724', // App ID from the App Dashboard
//channelUrl : 'http://exampb.com/plugins/', // Channel File for x-domain communication
status : true, // check the login status upon init?
cookie : true, // set sessions cookies to allow your server to access the session?
xfbml : true // parse XFBML tags on this page?
});
// Additional initialization code such as adding Event Listeners goes here
FB.ui(
{
method: 'feed',
},
function(response) {
if (response && response.post_id) {
alert('Post was published.');
} else {
alert('Post was not published.');
}
}
);
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {return;}
js = d.createElement('script');
js.id = id;
js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
I tried this but its conflicting. With that share button obtained from FB.
You can use the Share Dialog, but it only responds with a proper callback if you authorize the User with the publish_actions permission: https://developers.facebook.com/docs/sharing/reference/share-dialog
I want to create a Facebook login button. Actually I did, but I need to get username, email and other information. How can I do this?
This is my code
<html>
<head></head>
<body>
<div id="fb-root"></div>
<script>
(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/tr_TR/sdk.js#xfbml=1&version=v2.4&appId=168750412481****";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="fb-login-button" data-max-rows="1" data-size="large" data-show-faces="false" data-auto-logout-link="true" data-scope="email"></div>
</body>
</html>
How can I get data-scope user email or other scope properties?
Accualy i need full code example. Because i think facebook documents are complicated. (Or for me) And I found a solution internet. Here you can see below;
FB Login Button:
<div class="fb-login-button" data-max-rows="1" data-size="large" data-show-faces="false" data-auto-logout-link="true" data-scope="email,user_hometown,user_birthday,user_education_history,user_website,user_work_history"></div>
FB Sdk initialize:
(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/tr_TR/sdk.js#xfbml=1&version=v2.4&appId=***********";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Getting other user information:
window.fbAsyncInit = function() {
FB.init({
appId : '************', // Set YOUR APP ID
channelUrl : 'http://hayageek.com/examples/oauth/facebook/oauth-javascript/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
version : 'v2.4',
oauth : true
});
FB.Event.subscribe('auth.authResponseChange', function(response)
{
if (response.status === 'connected')
{
console.log("<br>Connected to Facebook");
//SUCCESS
FB.api('/me', { locale: 'tr_TR', fields: 'name, email,birthday, hometown,education,gender,website,work' },
function(response) {
console.log(response.email);
console.log(response.name);
console.log(response.gender);
console.log(response.birthday);
console.log(response.hometown);
console.log(response.education);
console.log(response.website);
console.log(response.work);
}
);
}
else if (response.status === 'not_authorized')
{
console.log("Failed to Connect");
//FAILED
} else
{
console.log("Logged Out");
//UNKNOWN ERROR
}
});
};
Have a look at the docs at
https://developers.facebook.com/docs/javascript/examples#login
to see how you can do the Login and query the Graph API...
I am trying to get the email id of the user by using facebook sdk through javascript but I am unable to get it. The same function will return an email ID before. Please find the code below that Iam using to get the email id of the user.
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxxxxxx',
xfbml : true,
version : 'v2.4'
});
};
(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'));
FB.api('/me?fields=id,name,email', function(response) {
alert("JSON "+JSON.stringify(response));
});
Are you setting the AppId?
FB.init({
appId : 'FACEBOOK_APP_ID', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
You can test the Graph Api here.