在调用期间未加载Facebook SDK以获取登录状态

时间:2016-03-01 00:31:07

标签: angularjs facebook-javascript-sdk

我正在使用Facebook SDK构建应用程序但是我面临挑战,我尝试在将用户重定向到他的个人资料页面之前获取用户的登录状态,但是在调用期间获取登录状态我获得

的错误
ReferenceError: FB is not defined

现在SDK正在异步加载,因此错误有意义,我该如何解决问题。这是我的代码:

app.config(function ($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: "Views/ListPages.html",
            controller: 'MainCtrl',
            resolve: {
                authentication:["$location", "LoginFactory", function($location, LoginFactory){
                    console.log("in resolve");
                    LoginFactory.getLoginStatus()
                        .then(function(response){
                            if(response){
                                $location.path('/login');
                            }
                            else{
                                $location.path('/');
                            }
                        });
                }]
            }
        })
        .when('/login', {
            templateUrl: "Views/Login.html",
            controller: 'LoginCtrl'
        })
        .otherwise
        ({redirectTo: '/'});
});


loginApp.factory("LoginFactory", function ($rootScope, $q, $location, UserInfo) {
    return {
        getLoginStatus: function () {
            var deferred = $q.defer();
            FB.getLoginStatus(function (response) {
                if(!response || response.error){
                    deferred.reject(new error("User Not logged in."));
                }
                else{
                    deferred.resolve(response);
                }
            });
            return deferred.promise;
        },
        login: function () {
            FB.login(function (response) {
                if (response.authResponse === "connected") {
                    $rootScope.$broadcast('fb_connected', {facebook_id:response.authResponse.userID});
                } else {
                    $rootScope.$broadcast('fb_login_failed');
                }
            }, {scope: "read_insights, publish_pages, manage_pages"});
        },
        logout: function () {
            FB.logout(function (response) {
                if (response) {
                    $rootScope.$broadcast('fb_logout_succeded');
                    $location.path('/login');
                } else {
                    $rootScope.$broadcast('fb_logout_failed');
                }
            });
        }
    };

angular.module("LoginCtrlModule", ["FacebookLogin"])
    .controller("LoginCtrl", ["$scope", "$location", "LoginFactory", function ($scope, $location, LoginFactory) {
        $scope.login = function () {
            LoginFactory.login();
            $scope.on("fb_connected", function () {
                $location.path("/");
            });
            $scope.on("fb_login_failed", function(){
                $location.path("/login");
            });
        }
    }]);

app.run(function ($rootScope, $location, LoginFactory) {
    window.fbAsyncInit = function () {
        FB.init({
            appId: '',
            status: true,
            cookie: true,
            xfbml: true
        });
    };

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

});

我关注这些帖子: AngularJS- Login and Authentication in each route and controller http://www.sitepoint.com/implementing-authentication-angular-applications/

但我面临的问题是不同的。

感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

我认为解决方法是不调用FB.getLoginStatus()而是拥有一个包含用户信息和访问令牌的对象,每次我尝试路由时都应该检查用户信息对象是否为空,如果它不为null,则调用check login status方法并相应地采取路由或不采用路由。