使用AngularJS应用程序进行Firebase 3.0身份验证

时间:2017-02-13 07:26:11

标签: angularjs firebase firebase-authentication

我有一个AngularJS应用程序,我一直在使用Firebase来保存数据。

现在,我一直在努力根据Firebase 3.0指南重构我的身份验证码。

我面临的问题是,登录后,'分类广告' app.js文件中定义的状态不加载。控制台也不会抛出任何错误。

在我的应用程序中,我希望将我的用户定向到第一个实例的登录页面。所以为此我在app.js文件中有以下代码。我没有重构此文件中的任何代码。如果这是问题,请告诉我。

var now         = moment();
var future      = moment("2017-4-17 23:18:30");
var diff        = future.diff(now);
var duration    = moment.duration(diff);

以下是我的auth.ctr.js文件:

angular
.module('ngClassifieds', ['ngMaterial', 'ui.router', 'firebase'])


.run(["$rootScope", "$state", function($rootScope, $state) {
$rootScope.$on("$stateChangeError", function(event, toState, toParams, fromState, fromParams, error) {
  // We can catch the error thrown when the $requireAuth promise is rejected
  // and redirect the user back to the home page
  if (error === "AUTH_REQUIRED") {
    $state.go("auth");
  }
});
}])

    .config(function($mdThemingProvider, $stateProvider, $urlRouterProvider) {

    $mdThemingProvider
        .theme('default')
        .primaryPalette('blue-grey')
        .accentPalette('orange')
//      .backgroundPalette('blue-grey');


    $urlRouterProvider.otherwise('/auth');

    $stateProvider
        .state('auth', {
          url: '/auth',
          templateUrl: 'components/auth/auth.tpl.html',
          controller: 'authCtrl',

        })


    $stateProvider
        .state('classifieds', {
            url: '/notes', 
            templateUrl: 'components/classifieds/classifieds.tpl.html',
            controller: 'classifiedsCtrl',
            resolve: {
              // controller will not be loaded until $requireAuth resolves
              // Auth refers to our $firebaseAuth wrapper in the example above
              "currentAuth": ["auth", function(auth) {
                // $requireAuth returns a promise so the resolve waits for it to complete
                // If the promise is rejected, it will throw a $stateChangeError (see above)
                return auth.ref.$requireAuth();
              }]
            }

        })

以下是我的auth.fac.js:

(function() {

  "use strict";

  angular
    .module('ngClassifieds')
    .controller('authCtrl', function($scope, auth, $state, $firebaseAuth) {

      var auth = $firebaseAuth();


     $scope.login = function() {

        auth
          .$signInWithEmailAndPassword($scope.email, $scope.password)
          .then(function(result) {
            $state.go('classifieds');
          })
          .catch(function(error) {
            $scope.error = error;
          });
      }

  });

})();

另外,我的index.html每个firebase 3.0文档都有必要的信息:

(function() {

  "use strict";

  angular
    .module('ngClassifieds')
    .factory('auth', function($firebaseAuth) {


      function signOut() {
        return firebase.auth().signOut()
          .then(function() {
            console.log('signed out')
          })
          .catch(function(error) {
            console.log(error);
          });
      }

      return {
        signOut: signOut
      }

    });

})();

我很欣赏有关此问题的任何指导。

由于

1 个答案:

答案 0 :(得分:0)

问题出在“$ rootScope。$ on(...)”函数的第一个参数中。那么$ stateChangeError被删除了。实际上,默认情况下,所有状态事件都已被弃用和禁用。看到此链接,它可以帮助您:https://ui-router.github.io/ng1/docs/latest/modules/ng1_state_events.html。也可以通过此链接找到解决方案:https://ui-router.github.io/guide/ng1/migrate-to-1_0