FACTORY:获取Firebase简单登录的当前user.id(电子邮件/密码)

Question

我正在寻找一种可靠的方法来让所有控制器中的"当前用户ID"可用.使用:Firebase简单登录:电子邮件/密码验证

我的ida:我需要一个"工厂",我可以注入我的控制器,让"当前用户ID"始终可用.

我想出了这段代码:

    app.factory('User', ['angularFire',

    //Get Current UserID

    function(angularFire){

        console.log ('FACTORY: User');
            var currentUser = {};
            var ReturnStr = '';
        var ref = new Firebase("https://myFIREBASE.firebaseio.com/");
        var authClient = new FirebaseAuthClient(ref, function (err, user) {

            if (err) {
                    ReturnStr = 'FACTORY: User Error: ' + err; 
                console.log (ReturnStr);
                        //var User = ReturnStr;
            } else if (user) {
                console.log ('FACTORY: User: Login successfully:');
                console.log (user);
                currentUser = user;
            } else {
                //console.log ('-----------User: Logged Out ---------------');
                    ReturnStr = 'FACTORY: Logged out: Redirect to Login'; 
                console.log (ReturnStr);
                window.location.href = "/login.php";
            }
        });

    return currentUser;
        }
]);

我最简单的控制器看起来像:

function ToDoCtrl($scope, User) {
    $scope.MyUser = User;
    $scope.MyUser.test = 'Test';
}

在HTML(角度局部)我有:

<h2>{{MyUser.id}}</h2>
<h2>{{MyUser.email}}</h2>
<h2>{{MyUser.provider}}</h2>
<h2>{{MyUser.test}}</h2>

=> id,email,provider是'undefined'.在控制台中,我看到'FACTORY:用户:登录成功:',用正确的用户 - 对象.

=>异步加载数据问题？

我也尝试过(没有运气):

        $timeout(function () {
        currentUser = user;
        }

这样的工厂非常有用!谢谢你指点我正确的方向!

编辑1.1: 现在,使用$ rootscope hack

=>同样的效果 - mycontroller太快了 - 工厂慢了.

app.factory('User', ['$rootScope', '$timeout', 'angularFire',

    //Aktueller Benutzer auslesen

    function($rootScope, $timeout, angularFire){

        console.log ('FACTORY: User');
            var currentUser = {};
            var ReturnStr = '';
        var ref = new Firebase("https://openpsychotherapy.firebaseio.com/");
        var authClient = new FirebaseAuthClient(ref, function (err, user) {

            if (err) {
                    ReturnStr = 'FACTORY: User Error: ' + err; 
                console.log (ReturnStr);
                        //var User = ReturnStr;
            } else if (user) {
                console.log ('FACTORY: User: Login successfully:');
                        //currentUser = user;

            $timeout(function () {
                        ReturnStr = 'FACTORY: Inside timout'; 
                  console.log (ReturnStr);

                            currentUser = user;
                  console.log (currentUser);

                $rootScope.myUser = user;
                $rootScope.myUserID = user.id;
                $rootScope.loggedIn = true;
                            $rootScope.$apply();

                  return currentUser;
            });


            } else {
                //console.log ('-----------User: Logged Out ---------------');
                    ReturnStr = 'FACTORY: Logged out: Redirect to Login'; 
                console.log (ReturnStr);
                        //var User = ReturnStr;
                window.location.href = "/login.php";
            }
        });

    return currentUser;
        }
]);

TAHNKS任何有用的建议!不知道别人如何解决这个问题!

Answer 1

所以这是我对这个确切问题的解决方案.我正在为我的Angular应用程序使用Firebase,FirebaseAuthClient和angularFire.我遇到了我的登录系统的相同情况,你不能将$ scope注入工厂,因此我想出了一个控制器,它使用工厂来检索,添加,更新和删除东西.在控制器中,我有firebaseAuth的东西,用户值的设置,以及我分配给它的范围的引用.用户登录后,会将其重定向到另一个位置,此时app.js文件将在该地址位置与子控制器接管.

我的登录名也使用localStorage,因此登录将保持不变,您可以刷新而不必继续登录,并且您可以将其更改为cookie或sessionStorage.

如果你选择使用这种方法,这需要根据你的需要进行调整,无论如何都很复杂,但这对我来说非常可靠,我现在不再需要担心firebaseAuth或angularFire的东西了我的工厂都设置为来回传递数据.我只是在做angularJS的东西,主要是指令.所以这是我的代码.

注意:这将需要修改,有些东西将是伪的或开放式的,以便您找出满足您的需求.

AuthCtrl.js

'use strict';

angular.module('YOUR_APP', []).
controller('AuthCtrl', [
'$scope',
'$location',
'angularFire',
'fireFactory',

function AuthCtrl($scope, $location, angularFire, fireFactory) {
    // FirebaseAuth callback
    $scope.authCallback = function(error, user) {
        if (error) {
            console.log('error: ', error.code);
            /*if (error.code === 'EXPIRED_TOKEN') {
                $location.path('/');
            }*/
        } else if (user) {
            console.log('Logged In', $scope);
            // Store the auth token
            localStorage.setItem('token', user.firebaseAuthToken);
            $scope.isLoggedIn = true;

            $scope.userId = user.id;

            // Set the userRef and add user child refs once
            $scope.userRef = fireFactory.firebaseRef('users').child(user.id);
            $scope.userRef.once('value', function(data) {
                // Set the userRef children if this is first login
                var val = data.val();
                var info = {
                    userId: user.id,
                    name: user.name
                };
                // Use snapshot value if not first login
                if (val) {
                    info = val;
                }
                $scope.userRef.set(info); // set user child data once
            });

            $location.path('/user/' + $scope.userRef.name());
        } else {
            localStorage.clear();
            $scope.isLoggedIn = false;
            $location.path('/');
        }
    };

    var authClient = new FirebaseAuthClient(fireFactory.firebaseRef('users'), $scope.authCallback);

    $scope.login = function(provider) {
        $scope.token = localStorage.getItem('token');
        var options = {
            'rememberMe': true
        };
        provider = 'twitter';

        if ($scope.token) {
            console.log('login with token', $scope.token);
            fireFactory.firebaseRef('users').auth($scope.token, $scope.authCallback);
        } else {
            console.log('login with authClient');
            authClient.login(provider, options);
        }
    };

    $scope.logout = function() {
        localStorage.clear();
        authClient.logout();
        $location.path('/');
    };
}

]);

而现在,这个漂亮而简单但又可重复使用的工厂.您需要为baseUrl变量设置应用的Firebase路径才能生效.

fireFactory.js

'use strict';
angular.module('YOUR_APP').
factory('fireFactory', [
function fireFactory() {
    return {
        firebaseRef: function(path) {
            var baseUrl = 'https://YOUR_FIREBASE_PATH.firebaseio.com';
            path = (path !== '') ?  baseUrl + '/' + path : baseUrl;
            return new Firebase(path);
        }
    };
}

]);

信息

您只为工厂提供一条路径引用,例如"用户",它将用作完整路径的一部分,用于存储用户数据的位置.

fireFactory.firebaseRef('users')

一旦你有一个用户的参考集,他们将不需要再次设置它将只使用现有的数据和.auth().另外,如果localStorage中存在"令牌",它也会使用它来auth()用户.

否则,它将登录()用户并弹出Oauth窗口,以便他们使用您提供的任何选项来执行此操作.

在Firebase/FirebaseAuthClient和angularFire上,我花了很多时间,很多小时甚至几个月都在寻找比这更好的东西.通过Firebase API和FireAuth API的方式,无论如何使用angularFire使它们彼此很好地玩耍是非常烦人的.这非常令人沮丧,但我终于完成了它.

如果你想查看我的应用程序的代码,看看我是如何更完整地做这些事情,你可以在我的Webernote github repo的这个分支中找到它.

随意分叉,在本地安装和运行它,或者即使你喜欢也可以为它做贡献.我可以自己使用一些帮助:)

希望这对你有所帮助!!