【问题标题】:Removing multiple page reload issue消除多页重载问题
【发布时间】:2013-07-30 04:44:31
【问题描述】:

我正在尝试获取用户最喜欢的电影和其他详细信息以及 FB JS SDK。以下对我来说是正确的。我曾尝试使用 ajax 来删除页面重新加载。但我没有找到为什么在登录按钮出现之前页面被重新加载两次。并且在用户输入登录凭据并单击登录按钮后,在数据出现之前页面重新加载了两次。 我想删除这个多重页面重新加载。有人可以检查代码并使其更容易吗?

登录.php:

<?php
session_start();
$appId = '66'; 
$appSecret = 'sdsds3'; // 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:fb="http://www.facebook.com/2008/fbml" xml:lang="en-gb" lang="en-gb" ><head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<title>JS/Ajax Facebook Connect</title>
 <script>
 function AjaxResponse()
 {
    var myData = 'connect=1'; 
     $.ajax({
    type: "POST",
    url: "process_facebook.php",
    data: myData
    }).done(function(result) {
    $("#fb-root").html(result);
    });
   }

function LodingAnimate() //Show loading Image
{
    $("#LoginButton").hide(); //hide login button once user authorize the application
}
 </script></head><body>
<?php
if(!isset($_SESSION['logged_in']))
{
?>
    <div id="results">    </div>
    <div id="LoginButton">
    <div class="fb-login-button" onlogin="javascript: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() {
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(){
        FB.login(function(response) {
        if (response.status === "connected")
        {
            LodingAnimate(); //Animate login
            FB.api('/me', function(data) {
//            $("#fb-root").append(data.);
            console.log(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();
              } }); 
         }     });  }
</script>
</body>
</html>

process_facebook.php:

<?php
session_start();
$appId = '66549'; //Facebook App ID
$appSecret = '3944'; // 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/

if(isset($_POST["connect"]) && $_POST["connect"]==1)
{
    if (!class_exists('FacebookApiException')) {
    require_once('facebook.php' );
    }
        $facebook = new Facebook(array(
        'appId' => $appId,
        'secret' => $appSecret,
    ));
    $fbuser = $facebook->getUser();
 if ($fbuser) {
        try {
         $user_interest = $facebook->api('/me/movies');
        //print user facebook data
        echo '<pre>';
        //print_r($user_interest);
        foreach ($user_interest['data'] as $var)
    {
         $ID=$var['id'];
         $Name=$var['name'];
         echo '<br/>';
         print_r($Name); echo '<br/>';
         print_r($ID);

    }
        echo '</pre>';
}
 catch (FacebookApiException $e) {
    echo '<pre>'.htmlspecialchars(print_r($e, true)).'</pre>';
    $user = null;
  }}}
?>

【问题讨论】:

    标签: php javascript facebook facebook-javascript-sdk


    【解决方案1】:

    代替具有“onlogin”和“scope”属性的“fb-login-button”,只需制作一个简单的按钮/链接/任何东西,然后在“onclick”事件中调用“CallAfterLogin”。您没有正确使用 FB.login,例如,您必须将其放入范围。

    请看这里:https://developers.facebook.com/docs/reference/javascript/FB.login/

    顺便说一句,我不会调用函数“CallAfterLogin”,因为它不是在登录后调用的,而是登录代码。而且您根本不需要 process_facebook.php,您只需使用 JavaScript SDK 即可,无需使用 jQuery/Ajax。

    【讨论】:

    • 谢谢哥们,你能告诉我如何在浏览器上打印console.log(data);数据在控制台中写入的地方吗?我想在浏览器上打印/me/movies 而不移动到 process_facebook!
    • 你可以改变这一行:FB.api('/me', function(data) - switch to /me/movies and the console.log entry in the next line should deliver the stuff
    • 我已经试过了,但它给出了错误you must allow to access your email,可能是它访问来自/me的电子邮件
    • 嗯,邮箱当然不在/me/movies连接中,需要使用login范围内的email权限才能获取/me连接中的email。
    • 学习javascript。这是您将得到的最佳答案;) - 我们不是来提供完成的解决方案,我们来这里是为了引导您走上(自己的)开发之路。否则你可以雇人;)
    猜你喜欢
    • 2012-05-13
    • 1970-01-01
    • 2013-06-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多