2013-07-24 2 views
0

Я пытаюсь создать fb javascript loging с помощью ajax, php. Он работает и извлекает требуемые данные из facebook. Но как только пользователь нажимает на логин, после перезагрузки страницы страница перезагружается дважды после отображения данных. Вот мой код. может ли кто-нибудь указать, где ошибка или какая-либо ссылка?Facebook javascript login using ajax-jquery

<?php 
session_start(); 
$appId = '669340023079549'; 
$appSecret = '390c04c60d19f38e113ea44f268aca44'; // Facebook App Secret 
$return_url = 'http://yoursite.com/connect_script/'; //path to script folder 
$fbPermissions = 'publish_stream,email'; //more permissions : https://developers.facebook.com/docs/authentication/permissions/ 
?> 
<!DOCTYPE html> 
<html xmlns:f b="http://www.facebook.com/2008/fbml" xml:lang="en-gb" lang="en-gb" ><head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 
<title>JS/Ajax Facebook Connect</title> 
<script> 
function AjaxResponse() 
{ 
    // alert("4"); 
    var myData = 'connect=1'; //For demo, we will pass a post variable, Check process_facebook.php 
    $.ajax({ 
    type: "POST", 
    url: "process_facebook.php", 
    dataType:"html", 
    data:myData, 
    success:function(response){ 
//  alert(response); 
    $("#results").html('<fieldset style="padding:20px">'+response+'</fieldset>'); //Result 
},  error:function (xhr, ajaxOptions, thrownError){ 
    $("#results").html('<fieldset style="padding:20px;color:red;">'+thrownError+'</fieldset>'); //Error 
    } }); } 

function LodingAnimate() //Show loading Image 
{ 
    //alert("3"); 
    $("#LoginButton").hide(); //hide login button once user authorize the application 
    $("#results").html('<img src="ajax-loader.gif" /> Please Wait Connecting...'); //show loading image while we process user 
} 
</script></head><body> 
<?php 
if(!isset($_SESSION['logged_in'])) 
{ 
?> 
    <div id="results"> </div> 
    <div id="LoginButton"> 
    <div class="fb-login-button" onlogin="return CallAfterLogin();" size="medium" scope="<?php echo $fbPermissions; ?>">Connect With Facebook</div> 
    </div> 
<?php 
} 
?> 
<div id="fb-root"></div> 
<script type="text/javascript"> 
window.fbAsyncInit = function() { 
// alert("1"); 
FB.init({ 
    appId: '<?php echo $appId; ?>', 
    cookie: true, 
    xfbml: true, 
    channelUrl: '<?php echo $return_url; ?>channel.php', 
    oauth: true});}; 

    (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); 

     }()); 

function CallAfterLogin(){ 
    //alert("2"); 
    FB.login(function(response) { 
     if (response.status === "connected") 
     { 
      LodingAnimate(); //Animate login 
      FB.api('/me', function(data) { 
       if(data.email == null) 
       { 
        //Facbeook user email is empty, you can check something like this. 
        alert("You must allow us to access your email id!"); 
        ResetAnimate(); 

       }else{ 
        AjaxResponse(); 
       } 
       }); 
     } 
     return true; 
    }); 

} 
</script> 
</body> 
</html> 

ответ

1

Попробуйте эту

Смените

<div class="fb-login-button" onlogin="javascript:CallAfterLogin();" size="medium" scope="<?php echo $fbPermissions; ?>">Connect With Facebook</div> 

в

<div class="fb-login-button" onlogin="return CallAfterLogin();" size="medium" scope="<?php echo $fbPermissions; ?>">Connect With Facebook</div> 

function CallAfterLogin(){ 
    //alert("2"); 
    FB.login(function(response) { 
     if (response.status === "connected") 
     { 
      LodingAnimate(); //Animate login 
      FB.api('/me', function(data) { 
       if(data.email == null) 
       { 
        //Facbeook user email is empty, you can check something like this. 
        alert("You must allow us to access your email id!"); 
        ResetAnimate(); 

       }else{ 
        AjaxResponse(); 
       } 
       }); 
     } 
     return true; 
    }); 

} 
+0

Спасибо за ответ, я должен также изменить функцию? – user123

+0

Хорошо, позвольте мне попробовать! – user123

+0

После изменения никаких изменений, даже теперь кнопка входа остается на экране, а не извлечена и отображается в браузере! – user123