The Facebook login window appears and disappears without entering the application.

Question

I created a facebook application using the Javascript SDK. It works fine for me (perhaps because the application is associated with my account), but it does not work for other users. When the user clicks the login button, a dialog box appears and asks for the username and password of the facebook user. But then the dialog disappears, and the login button still exists. When the user clicks the Login button again or refreshes the page, a dialog box will appear and disappear very quickly. The user logs into his facebook account, but he is not logged into the application.

Here is a sample code:

<div id="fb-root"></div> <script> window.fbAsyncInit = function() { FB.init({ appId : 'xxxxxxxxxxx', // App ID 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(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.'); } }); } 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(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 = "//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 testAPI() { console.log('Welcome! Fetching your information.... '); FB.api('/me', function(response) { userData = response; document.getElementById('name').value=userData.name; document.getElementById('email').value=userData.email; }); } function submit(){ FB.api('/me', function(response) { userData = response; console.log(userData); var form = $("#login-form form"); var serializedData=form.serialize()+'&id='+userData.id+'&email='+userData.email; console.log(serializedData); $.ajax({ url: './abc.php', type: 'POST', data: serializedData, dataType:'json', success: function (response) {}, error: function (xhr, ajaxOptions, thrownError){} }); }); return false; } function logout(){ FB.logout(function(response) { // Person is now logged out console.log('You have logged out of Bookatdoor. Thank you!'); location.reload(); }); } </script> <!-- Below we include the Login Button social plugin. This button uses the JavaScript SDK to present a graphical Login button that triggers the FB.login() function when clicked. Learn more about options for the login button plugin: /docs/reference/plugins/login/ --> <fb:login-button show-faces="true" width="200" max-rows="1"></fb:login-button> <br> <div id="login-form"> <form action="" method="POST" onsubmit="submit();return false;"> Name: <input type="text" name="name" id="name" placeholder="Name"> Email: <input type="email" name="email" id="email" placeholder="Email" disabled> Password: <input type="password" name="pwd" placeholder="Password"> Re-Password: <input type="password" placeholder="Re-Type Password"> College: <select name="college"> <?php include "./connect.php"; $query="select * from college"; $result=mysqli_query($con,$query) or die(mysqli_error($con)); while ($row=mysqli_fetch_array($result)) { echo "<option value='".$row['ID']."'>".$row['NAME']."</option>"; } ?> </select> </form> <button onclick="submit()">Submit</button> </div> <button onclick="logout()">Logout</button> 

Answer 1

In the same situation, a login dialog box appears on me.

Perhaps the reason is that the application mode for the sandbox (you can check it in the main application settings) is turned on.

This application can only be used by developers. (I'm not very sure that your friends can also use the developer or not)

Just unplug it, unplug it, then it works for others. This method works for me, desire also works for you.

Answer 2

In my case, this was because I asked for the wrong permission:

 FB.login(function(response) { // handle the response }, {scope: 'email,name,user_likes'}); 

removing 'name' solved it ...

Answer 3

EDIT: I had the same problem many times ... when the application was still in sandboxmode ..

Make sure the APP is still in Sandboxmode and is checking the console for errors.