How to redirect users with unverified emails using Angular UI-Router?

FullStack

I am using AngularJS with Meteor and wanted to redirect users with unverified emails to the sign in page. I have created a sign in view in /client/routes.js:

app.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider){
  $urlRouterProvider.otherwise('/');

  $stateProvider

  .state('signin', {
    url:'/signin',
    views: {
      main: {
        templateUrl: 'client/views/profile/signin.tpl'
      }
    }
  })

Note that there are other states I am not listing for brevity sake.

Now, I want to redirect users to this sign in page if their emails have not been verified. How do I modify the example below from UI-Router FAQs to meet my needs? Other solutions not using the example below are acceptable to me as long as they address the issue at hand.

Example: Uses the data object on the state config to define a rule function that will run logic against the user (here using an example service called $currentUser). The $stateChangeStart handler catches all state transition and performs this rule check before allowing the transition, potentially blocking it and/or redirecting to a different state.

app.config(function($stateProvider) {
  $stateProvider.state('privatePage', {
    data: {
      rule: function(user) {
        // ...
      }
  });
});
app.run(function($rootScope, $state, $currentUser) {
  $rootScope.$on('$stateChangeStart', function(e, to) {
    if (!angular.isFunction(to.data.rule)) return;
    var result = to.data.rule($currentUser);

    if (result && result.to) {
      e.preventDefault();
      // Optionally set option.notify to false if you don't want 
      // to retrigger another $stateChangeStart event
      $state.go(result.to, result.params, {notify: false});
    }
  });
});
vvondra

The example from the FAQ attempts to create a general way to add a rule to any page. Let's keep it simple:

app.run(function($rootScope, $state, UserService) {
    $rootScope.$on('$stateChangeStart', function(event, toState) {
        // don't check auth on login routes
        if (["signin"].indexOf(toState.name) === -1) {
            if (UserService.doesNotHaveVerifiedEmail()) {
                event.preventDefault();
                $state.go('signin');
                return;
            }
        }
    }
}); 

Anytime a state is loaded and it's not the signin state, you check if the user is verified (depends on your application, here I am injecting a UserService which I assume has knowledge about the user's status) and if not, you prevent that state change and redirect them to the signin page.

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

Angular UI Router - How to use $uiViewScroll in code

분류에서Dev

Angular UI Router: How to save parent state?

분류에서Dev

Secure url's while using ui router-Angular Js

분류에서Dev

How to add route filters to Angular UI-Router?

분류에서Dev

Subdomains using UI-Router

분류에서Dev

how to redirect users to a page on notification click

분류에서Dev

Angular UI-Router默认状态问题

분류에서Dev

Angular UI-Router templateUrl 문제

분류에서Dev

Angular UI-Router templateUrl Issue

분류에서Dev

Angular ui-router subview 문제

분류에서Dev

angular-ui-router 다중 뷰

분류에서Dev

Angular 용 Ui-Router-Partials html

분류에서Dev

Using React Router to Redirect to next page after successful login

분류에서Dev

Angular-UI-Router : ui-router로 href를 피해야합니까?

분류에서Dev

How to redirect/reroute DNS requests on a Netgear N600 router

분류에서Dev

Angular UI Router로 promise 배열 해결

분류에서Dev

Angular ui-router 중첩보기

분류에서Dev

Express가있는 Angular ui-router

분류에서Dev

Named view in angular ui-router not updating, despite being watched

분류에서Dev

Angular UI-Router 기본 상태 문제

분류에서Dev

Express가있는 Angular ui-router

분류에서Dev

Angular ui-router doesn't change location

분류에서Dev

Angular - UI Router - HTML5 Mode - WebForms

분류에서Dev

Meteor angular-ui-router 라우팅 로직

분류에서Dev

Angular UI-Router : 중첩 된 뷰

분류에서Dev

Angular ui.router 앵커 태그 문제

분류에서Dev

How can I immediately disable all emails using postfix?

분류에서Dev

Angular ui-router reloading ng-include outside ui-view

분류에서Dev

Angular-ui-router : 자식이 활성화 된 ui-sref-active