从Facebook获取用户信息与javascript连接

时间:2013-05-22 13:38:27

标签: javascript html facebook facebook-javascript-sdk

我试图从Facebook获取用户信息而没有成功,有人可以告诉我如何以及在哪里将它放在我的代码中? 我已经尝试使用FB.getLoginStatus以及facebook教程中的其他一些,我想我不知道在我的代码中把它放在哪里... 我必须在mount的末端做这个util,但我之前从未使用过html和javascript ..所以请帮助我们! 非常感谢你!

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="text/html; charset=utf-8">

        <title>SlickQuiz Demo</title>

        <link href="css/reset.css" media="screen" rel="stylesheet" type="text/css">
        <link href="css/slickQuiz.css" media="screen" rel="stylesheet" type="text/css">
        <link href="css/master.css" media="screen" rel="stylesheet" type="text/css">
        <link href="css/jquery.mobile-1.3.1.min.css" rel="stylesheet" type="text/css">      


    </head>

    <body id="slickQuiz"> 
        <div data-role="header">
            <h1 class="quizName"><!-- where the quiz name goes --></h1>
        </div>
        <div data-role="content" class="quizArea">
            <div class="quizHeader">
                <!-- where the quiz main copy goes -->

               <a class="button startQuiz" data-role="button" href="#" data-theme="b">Iniciar o teste!</a>               
            </div>

            <!-- where the quiz gets built -->
        </div>      

        <div class="quizResults">
            <h3 class="quizScore">Pontuação: <span><!-- where the quiz score goes --></span></h3>

            <h3 class="quizLevel"><strong>Nível:</strong> <span><!-- where the quiz ranking level goes --></span></h3>

            <div class="quizResultsCopy">
                <!-- where the quiz result copy goes -->
            </div>
        </div>

        <script src="js/jquery.js"></script>
        <script src="js/slickQuiz-config.js"></script>
        <script src="js/slickQuiz.js"></script>
        <script src="js/master.js"></script>

        <fb:login-button show-faces="true" width="200" max-rows="1" perms="user_hometown,user_about_me,email,user_address" autologoutlink="true"></fb:login-button>    

        <div id="fb-root"></div>
        <script src="http://connect.facebook.net/en_US/all.js"></script>
        <script>        
          window.fbAsyncInit = function() {
              FB.init({
                appId      : '245686095571989', // App ID
                channelUrl : 'http://localhost:8080/SlickQuiz/', // Channel File
                status     : true, // check login status
                cookie     : true, // enable cookies to allow the server to access the session
                xfbml      : true,  // parse XFBML
                oauth      : true   
              });

              FB.api('/me', function(response) {
                  alert(response.name);
              });

              FB.Event.subscribe('auth.authResponseChange', function(response) {
                if (response.status === 'connected') {
                  testAPI();
                } else if (response.status === 'not_authorized') {
                  FB.login();
                } else {
                  FB.login();
                }
              });
          };

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

          function testAPI() {
            console.log('Welcome!  Fetching your information.... ');
            FB.api('/me', function(response) {
                alert('3');
                console.log('Good to see you, ' + response.name + '.');
                alert(response.name);
            });
          }     

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

2 个答案:

答案 0 :(得分:0)

嗯,上面的代码中有很多内容我不明白为什么你需要它。首先,你有没有理由认为真实?你在使用oauth吗?

我尝试将其移植到jsfiddle页面以向您显示工作代码,但FB确实阻止了域外APPID的使用。这可以让您了解所需内容:http://jsfiddle.net/7Ekz9/

window.fbAsyncInit = function () {
  FB.init({
   appId: '245686095571989', // App ID
   status: true, // check login status
   cookie: true, // enable cookies to allow the server to access the session
   xfbml: true
  });
  FB.login(function (response) {
   console.log(response);
   if(response.authResponse){
    testAPI();
   }
  });
};

仅供参考:我将all.js作为外部资源加载。你也可以尝试一下。

答案 1 :(得分:0)