I am making a facebook app for which i need permissions other than the basic permission. I have tried using scope as well as changing in the app settings, still I get only the basic permissions and no more other permissions. Below is the code :
<html>
<head></head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'xxxxxxxxxxxx',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
testAPI();
} else if (response.status === 'not_authorized') {
FB.login(function(response) {
// handle the response
}, {scope:'user_photos,user_friends,friends_photos,user_status,publish_stream,user_photo_video_tags'});
} else {
FB.login(function(response) {
// handle the response
}, {scope:'user_photos,user_friends,friends_photos,user_status,publish_stream,user_photo_video_tags'});
}
});
};
// 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));
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
}
});
</script>
<fb:login-button show-faces="true" width="200" max-rows="1"></fb:login-button>
</body>
</html>
I understand that it takes some time for app permissions to propagate, but I have waited for hours. Any hint on whats going wrong here?
Thanks.
Not sure why your code is not working and I am yet to try running it on my machine by I am posting a working code here. Please try using this code after following steps mentioned below
Create a new app on facebook.
In Permissions tab, select the user permissions that you want from user.
In code mentioned below, input your app id and try running it.
Code below is taken from http://hayageek.com/examples/oauth/facebook/oauth-javascript/index.php and is basic implementation of Javascript SDK.
<html>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXX', // App ID
channelUrl : 'http://192.168.1.146/facebook/index.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe('auth.authResponseChange', function(response)
{
if (response.status === 'connected')
{
document.getElementById("message").innerHTML += "<br>Connected to Facebook";
//SUCCESS
}
else if (response.status === 'not_authorized')
{
document.getElementById("message").innerHTML += "<br>Failed to Connect";
//FAILED
} else
{
document.getElementById("message").innerHTML += "<br>Logged Out";
//UNKNOWN ERROR
}
});
};
function Login()
{
FB.login(function(response) {
if (response.authResponse)
{
getUserInfo();
} else
{
console.log('User cancelled login or did not fully authorize.');
}
},{scope: 'user_photos'});
}
function getUserInfo() {
FB.api('/me', function(response) {
var str="<b>Name</b> : "+response.name+"<br>";
str +="<b>Link: </b>"+response.link+"<br>";
str +="<b>Username:</b> "+response.username+"<br>";
str +="<b>id: </b>"+response.id+"<br>";
str +="<b>Email:</b> "+response.email+"<br>";
str +="<input type='button' value='Get Photo' onclick='getPhoto();'/>";
str +="<input type='button' value='Logout' onclick='Logout();'/>";
document.getElementById("status").innerHTML=str;
});
}
function getPhoto()
{
FB.api('/me/picture?type=normal', function(response) {
var str="<br/><b>Pic</b> : <img src='"+response.data.url+"'/>";
document.getElementById("status").innerHTML+=str;
});
}
function Logout()
{
FB.logout(function(){document.location.reload();});
}
// 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));
</script>
</div>
</body>
</html>
Update: Hope this solves your problem, I will have a look at your tonight and explain what is going wrong with it.
Related
I already use this code,i get user name but i can't get email address please some example how to get email address in face api .but many user give some example it does n't work so give valuable code
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '64530546436364535', // App ID
channelUrl : '//WWW.loginhire.com', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
testAPI();
} else if (response.status === 'not_authorized') {
FB.login();
} else {
FB.login();
}
});
};
// 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));
function login() {
FB.login(function(response) {
if (response.authResponse) {
// connected
testAPI();
} else {
// cancelled
}
}, { scope: 'email' });
}
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.' + ' Email: ' + response.email + ' Facebook ID: ' + response.id);
//console.log('Good to see you, ' + response.name + '.');
console.log(' Email: ' + response.email+'.' );
});
}
</script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '645304363653fghdfg', // App ID
channelUrl : '//WWW.channelUrl .com', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Here we subscribe to the auth.authResponseChange JavaScript event. This event is fired
// for any authentication related change, such as login, logout or session refresh. This means that
// whenever someone who was previously logged out tries to log in again, the correct case below
// will be handled.
FB.Event.subscribe('auth.authResponseChange', function(response) {
// Here we specify what we do with the response anytime this event occurs.
if (response.status === 'connected') {
// The response object is returned with a status field that lets the app know the current
// login status of the person. In this case, we're handling the situation where they
// have logged in to the app.
testAPI();
} else if (response.status === 'not_authorized') {
// In this case, the person is logged into Facebook, but not into the app, so we call
// FB.login() to prompt them to do so.
// In real-life usage, you wouldn't want to immediately prompt someone to login
// like this, for two reasons:
// (1) JavaScript created popup windows are blocked by most browsers unless they
// result from direct interaction from people using the app (such as a mouse click)
// (2) it is a bad experience to be continually prompted to login upon page load.
FB.login();
} else {
// In this case, the person is not logged into Facebook, so we call the login()
// function to prompt them to do so. Note that at this stage there is no indication
// of whether they are logged into the app. If they aren't then they'll see the Login
// dialog right after they log in to Facebook.
// The same caveats as above apply to the FB.login() call here.
FB.login();
}
});
};
// 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));
// Here we run a very simple test of the Graph API after login is successful.
// This testAPI() function is only called in those cases.
function login() {
FB.login(function(response) {
if (response.authResponse) {
// connected
testAPI();
} else {
// cancelled
}
}, { scope: 'email'/'phone' });
}
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.' + ' Email: ' + response.email + ' Facebook ID: ' + response.id);
//console.log('Good to see you, ' + response.name + '.');
});
}
</script>
<fb:login-button show-faces="false" width="200" max-rows="1" scope="email" onclick="testAPI();" onlogin="Log.info('onlogin callback')">
Login with Facebook
</fb:login-button>
</span>
I have to make a website to login with Facebook. Makes sense to be able to send them an email, but I can't get the email address from Facebook.
I followed exactly the instructions from https://developers.facebook.com/docs/facebook-login/getting-started-web/
I add it {scope:email} in FB.login.
How can I get the email address with Facebook API?
My code by now:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'app', // App ID
channelUrl : '//domain.COM/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.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
FB.api('/me', function(response) {
console.log(response);
});
} else if (response.status === 'not_authorized') {
FB.login(function(response) {},{scope: 'email'});
} else {
FB.login(function(response) {}, {scope: 'email'});
}
});
};
// 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));
</script>
<fb:login-button show-faces="true" width="200" max-rows="1"></fb:login-button>
I ran into the same issue. Deauthorize the app from the fb account. Then authorize the app again through your test page
I found that it didn't hit the below block once I authorized the app the first time. (adding the scope:email into FB.login once the app has been authorized does no good... i think)
} else if (response.status === 'not_authorized') {
FB.login(function(response) {},{scope: 'email'});
} else {
FB.login(function(response) {}, {scope: 'email'});
}
hope that helps
If you have logged in successfully, calling response.email will return the user's email address.
i have a login page where i will give link for facebook login but unfortunately the facebook oauth dialog opens up as soon as i land on the the login page .I want it on click of the link and not on page load.Can any help?
<p><a onclick='login(); return false;'>Login</a></p>
<script>
// Additional JS functions here
window.fbAsyncInit = function() {
FB.init({
appId : '3423243443', // App ID
status: true, // check login status
cookie: true, // enable cookies to allow server to access session,
xfbml: true, // enable XFBML and social plugins
oauth: true // enable OAuth 2.0
// channelUrl: 'http://www.yourdomain.com/channel.html' //custom channel
});
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
// connected
alert("connected1"+response.authResponse.expiresIn);
} else if (response.status === 'not_authorized') {
// not_authorized
login();
} else {
// not_logged_in
alert("not logged in");
login();
}
},true);
};
(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));
/*function login() {
FB.login(function(response) {
if (response.authResponse) {
testAPI(response)
// connected
alert("connected2 "+response.authResponse);
} else {
// cancelled
alert("cancelled");
alert("cancelled"+response.authResponse);
}
});
} ;
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.email + '.');
});
} ;*/
</script>
Because you inserted the FB.getLoginStatus, which calls your login function, in window.fbAsyncInit on every page's loads.
You should fire FB.getLoginStatus only though a button, with an onclick trigger.
Here is a little example: http://facebook.stackoverflow.com/a/15720747/2212966
I have mine wrapped with a jquery button click event handler. Here is a snippet from my code:
window.fbAsyncInit = function() {
FB.init({
appId : 'my-app-id',//use your facebook appId in here
status : false,
cookie : true,
xfbml : true,
version : 'v2.2'
});
jQuery('#signUpWithFacebookButtonId').click(function(){
FB.login(function(response) {
if (response.status === 'connected') {
console.log('Logged into your app and Facebook.');
} else if (response.status === 'not_authorized') {
console.log('The person is logged into Facebook, but not your app.');
} else {
console.log('The person is not logged into Facebook, so we are not sure if they are logged into this app or not.');
}
}, {scope: 'public_profile, email'});
});
};//end window.fbAsyncInit function
I am using javascript sdk to update status in facebook. This is my code
window.fbAsyncInit = function() {
FB.init({
appId : 'id', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code heres
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 + '.');
});
} else {
console.log('User cancelled login or did not fully authorize.')
}
});
};
// 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 = "http://connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
</script>
but i am getting An error occurred message while opening this page.please give a solution to solve this.Or any one else can share the app id which is working fine
I need to get the access token from FB.login method in Javascript SDK. My login code is
FB.login(function(response) {
if (response.session) {
if (response.perms) {
} else {
// user is logged in, but did not grant any permissions
alert("No Permission..");
}
} else {
// user is not logged in
alert("Please login to facebook");
}
}, {perms:'read_stream,publish_stream,offline_access'});
Is there any way to get access token? I am able to get the access token using PHP.
You can get access token using FB.getAuthResponse()['accessToken']:
FB.login(function(response) {
if (response.authResponse) {
var access_token = FB.getAuthResponse()['accessToken'];
console.log('Access Token = '+ access_token);
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: ''});
Edit:
Updated to use Oauth 2.0, required since December 2011. Now uses FB.getAuthResponse();
If you are using a browser that does not have a console, (I'm talking to you, Internet Explorer) be sure to comment out the console.log lines or use a log-failsafe script such as:
if (typeof(console) == "undefined") { console = {}; }
if (typeof(console.log) == "undefined") { console.log = function() { return 0; } }
response.session.access_token doesn't work in my code. But this works:
response.authResponse.accessToken
FB.login(function(response) { alert(response.authResponse.accessToken);
}, {perms:'read_stream,publish_stream,offline_access'});
If you are already connected, simply type this in the javascript console:
FB.getAuthResponse()['accessToken']
https://developers.facebook.com/docs/facebook-login/login-flow-for-web/
{
status: 'connected',
authResponse: {
accessToken: '...',
expiresIn:'...',
signedRequest:'...',
userID:'...'
}
}
FB.login(function(response) {
if (response.authResponse) {
// The person logged into your app
} else {
// The person cancelled the login dialog
}
});
response.session doesn't work anymore because response.authResponse is the new way to access the response content after the oauth migration.Check this for details:
SDKs & Tools › JavaScript SDK › FB.login
window.fbAsyncInit = function () {
FB.init({
appId: 'Your-appId',
cookie: false, // enable cookies to allow the server to access
// the session
xfbml: true, // parse social plugins on this page
version: 'v2.0' // use version 2.0
});
};
// 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'));
function fb_login() {
FB.login(function (response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
//console.log(response); // dump complete info
access_token = response.authResponse.accessToken; //get access token
user_id = response.authResponse.userID; //get FB UID
FB.api('/me', function (response) {
var email = response.email;
var name = response.name;
window.location = 'http://localhost:12962/Account/FacebookLogin/' + email + '/' + name;
// used in my mvc3 controller for //AuthenticationFormsAuthentication.SetAuthCookie(email, true);
});
} else {
//user hit cancel button
console.log('User cancelled login or did not fully authorize.');
}
}, {
scope: 'email'
});
}
<!-- custom image -->
<img src="/Public/assets/images/facebook/facebook_connect_button.png" />
<!-- Facebook button -->
<fb:login-button scope="public_profile,email" onlogin="fb_login();">
</fb:login-button>
window.fbAsyncInit = function () {
FB.init({
appId: 'Your-appId',
cookie: false, // enable cookies to allow the server to access
// the session
xfbml: true, // parse social plugins on this page
version: 'v2.0' // use version 2.0
});
};
// 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'));
function fb_login() {
FB.login(function (response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
//console.log(response); // dump complete info
access_token = response.authResponse.accessToken; //get access token
user_id = response.authResponse.userID; //get FB UID
FB.api('/me', function (response) {
var email = response.email;
var name = response.name;
window.location = 'http://localhost:12962/Account/FacebookLogin/' + email + '/' + name;
// used in my mvc3 controller for //AuthenticationFormsAuthentication.SetAuthCookie(email, true);
});
} else {
//user hit cancel button
console.log('User cancelled login or did not fully authorize.');
}
}, {
scope: 'email'
});
}
<!-- custom image -->
<img src="/Public/assets/images/facebook/facebook_connect_button.png" />
<!-- Facebook button -->
<fb:login-button scope="public_profile,email" onlogin="fb_login();">
</fb:login-button>