Here is the complete snippet of code that I am using. I have read through all the documentation and still not able to figure out this. I am running the code locally on visual studio 2010 and chrome browser. I have set my site url, canvas url and secure canvas url as localhost. I have my app domain empty. I am guessing that I am doing something wrong and I cannot figure out. Please help me
<html>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '129307260602861',
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
FB.Event.subscribe('auth.login', function(response) {
fblogin(); //first login time
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
alert('The status of the session is: ' + response.status);});
FB.Event.subscribe('auth.logout', function(response) {
alert('logout');
});
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
} ());
function fblogin() {
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
//check extened permisions
var access_token = response.authResponse.accessToken;
var user_id = response.authResponse.userID;
// Do your business
alert('here');
}
else {
//user is not logged in
alert('here');
}
});
}
</script>
<fb:login-button autologoutlink='true' perms='email,user_birthday,status_update,publish_stream'></fb:login-button>
</body>
</html>
Related
I am trying to get Users login status with facebook js sdk. Script works fine when i load it without any onclick event. But when i try to execute the js by firing the onclick only the <div id="fb-root"></div> gets updated, But no alert pops up.
function upload() {
function fbLoginStatus(response) {
if( response.status === 'connected' ) {
alert("Connected");
} else if( response.status === 'not_authorized') {
$('#overlay-shadow').fadeIn(500);
$('#overlay-container').fadeIn(650);
$('#scriptolution-soft-language.scriptolution-soft-box .content').html('<a href="javascript:void(0);" onclick="collapseAll();"
class="close-btn badge-language-close"></a><h3>Something is wrong !</h3><br/><h4>Our system got confused. Please try the "Download Cover"
option. Sorry.</h4>');
} else {
alert("Logged Out");
}
}
window.fbAsyncInit = function() {
FB.init({appId: '414212035337190', status: true, cookie: true, xfbml: true});
FB.getLoginStatus(fbLoginStatus);
FB.Event.subscribe('auth.statusChange', fbLoginStatus);
};
(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);
}());
}
So I've been trying to get a webpage to authenticate a user using Facebook OAuth. I've been following Facebook's tutorial on how to do so, and I have everything finished but I can't seem to make it work.
Here is the code...
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
function main(){ // runs all the other methods when needed, and maintains the proper path from making the form to posting to Facebook
//var imageURL = getImageURL();
//$("img[src='" + imageURL + "']").after("</br><form><input type=\"checkbox\" name=\"geo\" value=\"geolocation\"><b>Use Geolocation?</b> </br> <b>Additional Information About the Image: </b> <input type=\"comment\" name=\"cmnt\"></form>");
//alert("Form should have been placed.");
}
function testAPI() {
alert('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
alert('Good to see you, ' + response.name + '.');
});
}
// This function right now is hard coded to one particular image right now for testing purposes
// Should be coded in the future to return the URL of a long-pressed image
function getImageURL(){
var url = "http://upload.wikimedia.org/wikipedia/commons/thumb/2/21/Solid_black.svg/200px-Solid_black.svg.png";
return url;
}
// Facebook login code
function login() {
FB.login(function(response) {
if (response.authResponse) {
// connected
alert("Running testAPI();");
testAPI();
} else {
alert("Login not complete.");
// canceled
}
});
}
function testAPI() {
alert('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
alert('Good to see you, ' + response.name + '.');
});
}
</script>
</head>
<body onload="main()">
<div id="fb-root"></div>
<script>
//-----------------------------
// This is an initilization script created by Facebook.
//-----------------------------
window.fbAsyncInit = function() {
alert("Running Facebook init..");
FB.init({
appId : '488272104524396', // App ID
channelUrl : '//t50.novarra.net/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
});
// Additional init code here
FB.getLoginStatus(function(response) {
alert("Getting Login Status..");
if (response.status === 'connected') {
// connected
alert("Response Status: Connected");
$('.fblogincontainer').removeClass('hidden');
testAPI();
} else if (response.status === 'not_authorized') {
alert("Response Status: Not Authorized");
// not_authorized
login();
} else {
alert("Response Status: Other");
// not_logged_in
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));
</script>
<b> Page </b>
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/2/21/Solid_black.svg/200px-Solid_black.svg.png">
<div id="content">
<div class="fblogincontainer hidden">
<div class="fb-login-button">Login to Facebook</div>
</div>
</div>
</body>
</html>
So my problems are that the FB>getLoginStatus doesn't even start. The alerts for it do not pop up.
Additionally the fb-login-button doesn't seem to function. It disappears for me.
I'm trying to login on my website with Facebook JS API from my iPhone. The login works fine on computer as well as iPad.
Here's the login screen:
On iPhone however, I get to a screen which looks like this:
When I close the Facebook screen with the "Back to previous page" message and reload the login page, I'm logged in successfully. It looks like the problem is, that iPhone is unable to close the login pop-up screen.
Here's my JavaScript code:
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId : '', // the app id
status : true,
cookie : true,
xfbml : true
});
FB.getLoginStatus(function(response) {
if (response.status == "connected") {
// do something
}
});
FB.Event.subscribe("auth.login", function(response) {
if (response.status == "connected") {
// do something
}
});
};
function facebookRedirectLogin(redirect) {
// do something
}
function logout() {
FB.logout(function(response) {
// do something
});
}
(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>
<div class="fb-login-button" style="margin-bottom: 20px;">Forbind med Facebook</div>
How can I fix this problem?
Checkout this URL,
please do the settings as mentioned in the above URL, this code is working in mobile devices.
<html>
<head>
<title>My Facebook Login Page</title>
</head>
<body>
<div id="fb-root"></div>
<div id="login">
<p><button onClick="loginUser();">Login</button></p>
</div>
<div id="logout">
<p><button onClick="FB.logout();">Logout</button></p>
</div>
<script>
function loginUser() {
FB.login(function(response) { }, {scope:'email'});
}
</script>
<script>
(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);
}());
</script>
<script>
window.fbAsyncInit = function() {
FB.init({ appId: 'xxxxxxxxxxxx',
status: true,
cookie: true,
xfbml: true,
oauth: true});
FB.Event.subscribe('auth.authResponseChange', handleResponseChange);
};
</script>
<script>
function handleReponseChange(response) {
document.body.className = response.authResponse ? 'connected' : 'not_connected';
if (response.authResponse) {
alert(response);
}
}
</script>
</body>
I have the exact same problem. This may (or may not) be an open Facebook bug: https://developers.facebook.com/bugs/280811108698311
I am developing a Facebook App using JS SDK. Everything works fine on FF/Chrome/Safari, except on iPad where the SDK just won't load.
I tried it by using very simple code (most of it coming directly from Facebook's documentation), like that:
<!doctype html>
<html>
<head>
</head>
<body>
<div id="fb-root"></div>
<script src="//connect.facebook.net/en_US/all.js"></script>
<script>
/* All Facebook functions should be included
in this function, or at least initiated from here */
window.fbAsyncInit = function() {
FB.init({appId: MYAPPID,
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
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.');
}
});
};
(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);
}());
</script>
</div>
And nothing shows up. No popup (they are not blocked), no console.log, nothing.
Is it an issue with my code or is Facebook SDK going crazy today? I saw nothing relevant on the platform status.
I am trying to add Facebook connect on my website but I am experiencing lot of issues since Facebook moved to OAuth 2 protocol.
I would like users log in with their Facebook account and then, I would store their data in my database.
So I am using the Javascript SDK to catch the auth.login event and then redirect to my fb_login method which use Facebook PHP SDK.
But here is my first issue, most of the time, the auth.login event is not catch by the listener and so my method is not called.
Here is my “listener” Javascript code:
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId: '<?php echo $this->config->item('facebook_app_id'); ?>',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
[removed] = "<?php echo site_url('donateur/fb_signin'); ?>";
});
FB.Event.subscribe('auth.logout', function(response) {
alert("Logout :(");
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
alert('The status of the session is: ' + response.status);
});
};
(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);
}());
I would like to know if anyone has already experience this issue?
Does anybody has a “recent” doc about how to use Facebook connect in CodeIgniter?
http://codeigniter.com/forums/viewthread/189744/
And this: http://www.dannyherran.com/2011/02/facebook-php-sdk-and-codeigniter-for-basic-user-authentication/