Question

My problem is:
if I am already logged in facebook, then it automatically redirect the page and log in to my site.

What I need is even if I am logged in to facebook, it should stay on the page and after I click on the “facebook login” button then it will log in to my website.

<script>
    // 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));

    // Init the SDK upon load
    window.fbAsyncInit = function() {
        FB.init({
            appId: 'XXXXXXXXXXX', // App ID
            channelUrl: '//' + window.location.hostname + '/channel', // Path to your     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.login', function(response) {
            if (response.status === 'connected') {
                FB.api('/me', function(me) {
                    if (me.name) {
                        // the user is logged in and connected to your
                        // app, and response.authResponse supplies
                        // the user’s ID, a valid access token, a signed
                        // request, and the time the access token
                        // and signed request each expire
                        var uid = response.authResponse.userID;
                        var accessToken = response.authResponse.accessToken;
                        done1(uid, accessToken, me.email, me.name);
                    }
                })
            }

        });

        FB.Event.subscribe('auth.logout', function(response) {
        });


        // listen for and handle auth.statusChange events
        FB.Event.subscribe('auth.statusChange', function(response) {
            if (response.authResponse) {
                // user has auth'd your app and is logged into Facebook
                FB.api('/me', function(me) {
                    if (me.name) {
                        document.getElementById("authdisplayname").innerHTML = me.name;
                        if (response.status === 'connected') {
                            var uid = response.authResponse.userID;
                            var accessToken = response.authResponse.accessToken;
                            done1(uid, accessToken, me.email, me.name);
                        }
                    }
                })
                document.getElementById('auth-loggedout').style.display = 'none';
                document.getElementById('auth-loggedin').style.display = 'block';
            } else {
                // user has not auth'd your app, or is not logged into Facebook
                document.getElementById('auth-loggedout').style.display = 'block';
                document.getElementById('auth-loggedin').style.display = 'none';
            }
        }); 
        $("#authlogoutlink").click(function() { FB.logout(function() { window.location.reload(); }); });
    }

    function done1(a, b, c, d) {
        document.getElementById("<%= uid.ClientID %>").value = a;
        document.getElementById("<%= token.ClientID %>").value = b;
        window.location = "http://localhost:59019/fgfgf_2008/new_login.aspx?token=" + b + "&email=" + c + "&name=" + d;
    }
</script>

HTML Code:

<div id="fb-root">
</div>

<div>
    <div id="auth-status">
        <div id="auth-loggedout">
            <div class="fb-login-button" onlogin="done();" autologoutlink="true" scope="email,user_checkins">
                Log in with Facebook</div>
        </div>
        <div id="auth-loggedin" style="display: none">
            Hi, <span id="authdisplayname" runat="server"></span>(<a href="#" id="authlogoutlink">logout</a>)
        </div>
    </div>
</div>

Answer 1

I am not a master on facebook login issue, but after reading your question, it looks like that if the facebook user is logged in to its facebook account, then it also automatically logs into your application. But you want it to take place at the time when the user clicks on the login button, right.

What you can do is, you can make a “FacebookLogin()” function and you can call that function on a click event.

Something like:

On the HTML button

<div class="fb-login-button" onclick="FacebookLogin()" onlogin="done();" autologoutlink="true" scope="email,user_checkins">
                Log in with Facebook</div>

I am not very sure for this in your case, but it worked for me, try for once, remove ur all FB.Event.subscribe('auth.login', function(response) function, and use FB.login() function, and then redirect the user information to the page where ever you want. Here I am redirecting it to a Login.aspx page.

In the javascript function

function FacebookLogin() {
    FB.login(function(response) {
        if (response.authResponse) {
            window.location = "/Login.aspx?NewFacebookConnect=true&accessToken=" + response.authResponse.accessToken + "&userID=" + response.authResponse.userID;
        }
    });
}