javascript - 使用 JavaScript SDK 的 Facebook 用户电子邮件 ID

Question

我目前正在使用以下代码来获取使用我的应用程序的用户的电子邮件 ID

function get_id(cb){
    FB.init({
        appId  : .......,
        status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the session
        xfbml  : true // parse XFBML
    });

    FB.login(function(response) {
        if (response.authResponse) {
            var token = response.authResponse.accessToken;
            alert(token);
            accessToken = token;
            FB.api('/me?access_token=' + token + '', function (response) {

                cb(response.email);

            });

        }

     },{scope: 'email'});

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


}; // ending of get_id()

get_id(function (email) {
    userID=email;
    alert(email);
});

当前代码在一个单独的 javascript 文件中，按下按钮时调用此函数，我还包括了 <script src="http://connect.facebook.net/en_US/all.js"></script>在 HTML 文件中。我的浏览器 (google chrome) 每次尝试访问它时都会出现以下错误 “未捕获的 ReferenceError:FB 未定义”

我是开发 Facebook 应用程序的新手，所以我所有的引用资料都是 facebook 上的开发者页面，我确信这是一个小错误，但我无法理解它，如果有人能指出，我将不胜感激我可能哪里出错了

Answer 1

您的代码将无法正确加载。这部分:

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

不应该在任何函数内部，把它放在脚本标签中，在主体打开之后。它不能在一个单独的文件中。这只会异步加载 all.js，即 Facebook 的 JS SDK。如果您使用的是异步加载，则不应放置 <script src="http://connect.facebook.net/en_US/all.js"></script>在您的文档中，因为这将执行同步加载。

代码的其他部分:

FB.init({
    appId  : .......,
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    xfbml  : true // parse XFBML
});

也不应该在函数内部。这个片段负责在你的页面中启动FB JS SDK，加上你的应用信息，每个页面只需要调用一次，否则你会多次启动引擎，并且会出现困惑行为。 “FB”对象只会在 FB JS SDK 加载后创建。由于异步加载，您不知道它何时会发生。所以你必须将 FB.init 分配给这个窗口事件:

window.fbAsyncInit = function() {
    FB.init({
        appId  : .......,
        status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the session
        xfbml  : true // parse XFBML
    });
};

您想创建一个使用 Facebook 信息的 get_id 函数。你必须小心。如果您确定此函数将在 FB JS SDK 完全加载后调用，您可以在页面的任何部分创建它。但我认为最安全的方法是在 window.fbAsyncInit 中创建它。不要担心 token ，SDK 会为您完成:

window.fbAsyncInit = function() {
    FB.init({
        appId  : .......,
        status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the session
        xfbml  : true // parse XFBML
    });

    function get_id(cb){
        FB.login(function(response) {
            if (response.authResponse) {
                FB.api('/me', function (response) {
                    cb(response.email);
                });
            }
        },{scope: 'email'});
    }

};

但是当你这样做时，你将不确定你的函数是否已经创建。所以当你调用它时，你必须测试它是否存在:

if(get_id && typeof get_id == 'function') { 
    // It's safe to call your function, go ahead
    get_id(function (email) {
        userID=email;
        alert(email);
    });
} else {
    // Your function does not exists yet, do other stuff
}

祝你好运!