Ionic和Firebase用户身份验证,页面限制

时间:2016-02-03 16:55:45

标签: javascript angularjs ionic-framework firebase-authentication

我构建了一个简单的应用程序,可让您使用Firebase Auth注册帐户并登录。

我使用了Ionics starter" tab"申请。我按照教程:https://www.firebase.com/docs/web/libraries/angular/guide/user-auth.html#section-routers

用于根据用户的Auth状态阻止路由。使用下面的代码,我已经阻止您访问仪表板选项卡而不是为了测试目的登录,但是,您仍然可以访问它。我一步一步地按照教程,这就是我所拥有的。

app.js

// Before anything else I define firebase, create a reference to the url, 
// create a service for the url and create the Auth function.

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'firebase'])

   .constant('FirebaseUrl', 'https://<firebase-name>.firebaseio.com/')

   .service('rootRef', ['FirebaseUrl', Firebase])

   .factory("Auth", ["$firebaseAuth", function($firebaseAuth) {
      var ref = new Firebase("https://<firebase-name>.firebaseio.com/");
      return $firebaseAuth(ref);
   }])

   ...

app.js .run()

// Then in my `.run()` function I listen for our state change that fails  
// because it needs to authorized first.

.run(function($rootScope, $state, $ionicPlatform) {

  // ionic init. code here

  $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 login page
     if(error === "AUTH_REQUIRED") {
         $state.go("login");
     }
  });
})

app.js .config()

// Finally in my `.config()` I have my $stateProvider set up and my dashboard
// tab is resolving as to have auth required to view.

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

    $stateProvider

    // setup an abstract state for the tabs directive
    .state('tab', {
       url: '/tab',
       abstract: true,
       templateUrl: 'templates/tabs.html'
    })

    .state('login', {
       url: '/login',
       templateUrl: 'templates/login.html',
       controller: 'LoginCtrl as ctrl'
    })

    .state('tab.dash', {
       url: '/dash',
       views: {
         'tab-dash': {
            templateUrl: 'templates/tab-dash.html',
            controller: 'DashCtrl'
         }
       },
       resolve : {
         // controller will not be loaded until $waitForAuth resolves
         // Auth refers to our $firebaseAuth wrapper in the example above
         currentAuth: ["Auth", function(Auth) {
           // $waitForAuth returns a promise so the resolve waits for it to complete
           return Auth.$waitForAuth();
         }]
       }
     })

    // if none of the above states are matched, use this as the fallback
    $urlRouterProvider.otherwise('/login');

});

无论如何,当我点击登录页面上的临时链接(应用程序启动的位置)时,即使未登录,它仍然会将我带到仪表板页面!

我在这里缺少什么?

1 个答案:

答案 0 :(得分:0)

在您发布的示例中,您在firebase网站上发布的示例中显示return Auth.$requireAuth();并且您有return Auth.$waitForAuth();