将<script> ... </script>迁移到.js文件失败

时间:2015-09-02 17:25:19

标签: javascript jquery

我已经获得oAuth代码来处理HTML5中的标记。将其移动到.js文件并调用该文件时,我会收到错误。我已经尝试复制工作js文件(app.js)的格式,但我似乎无法让它工作。这是代码:

oAuth.js

var Facebook = function() {
    function mygetLoginStatus() {
        FB.getLoginStatus(function(response) {
            if (response.status === 'connected') {
                mygetProfileData();
            } else {
                FB.login();
            }
        });
    };

    function mygetProfileData() {
        FB.api('/me', {
            fields: 'first_name, last_name, email, picture, work'
        }, function(response) {
            document.getElementById('firstname').value = response.first_name;
        });
    };
    return {
        init: function() {
            window.fbAsyncInit = function() {
                FB.init({
                    appId: '[redacted]',
                    xfbml: true,
                    status: true,
                    version: 'v2.4'
                });
            };

            (function(d, s, id) {
                var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) {
                    return;
                }
                js = d.createElement(s);
                js.id = id;
                js.src = "//connect.facebook.net/en_US/sdk.js";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));

            mygetLoginStatus();
            mygetProfileData();
        },
    };
}();

registration.html

<script type="text/javascript" src="assets/js/oAuth.js"></script>
<script type="text/javascript" src="assets/js/app.js"></script>
...
<script type="text/javascript">
    jQuery(document).ready(function() {
        App.init();
        Facebook.init();
    });
</script>

控制台:

Uncaught ReferenceError: FB is not defined
mygetLoginStatus @ oAuth.js:12
Facebook.init @ oAuth.js:60
(anonymous function) @ registration.event:441
m.Callbacks.j @ jquery.min.js:2
m.Callbacks.k.fireWith @ jquery.min.js:2
m.extend.ready @ jquery.min.js:2
J @ jquery.min.js:2

我做错了什么?这些是我在最初在HTML中编写代码时遇到的相同类型的错误,所以我知道这似乎是某种范围的错误。

1 个答案:

答案 0 :(得分:1)

我想出来了。必须在返回节内定义FB以供其他功能使用。这是一个范围问题。该计划的主要逻辑还不完善,但为其他人记录了这一点。

var Facebook = function(){

 return {
    init: function() {
        window.fbAsyncInit = function() {
          FB.init({
            appId      : '[redacted]',
            xfbml      : true,
            status     : true,
            version    : 'v2.4'
          });
        };

       (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "//connect.facebook.net/en_US/sdk.js";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));
    },
    getLoginStatus: function() {
            FB.getLoginStatus(function(response) {
                    if (response.status === 'connected') {
                    //console.log('Logged in.');
                            getProfileData();
                    }
                    else {
                            FB.login();
                    }
            });

    },
    getProfileData: function() {
    //console.log('Welcome!  Fetching your information.... ');
            FB.api('/me',{fields: 'first_name, last_name, email, picture, work'}, function(response) {
                    document.getElementById('firstname').value = response.first_name; 
            });
    }
  };
}();