2017-06-08 17 views
1

アクセス許可/アクセス制御をAngularアプリケーションに追加する方法を決定する際に多くの問題が発生しています。今、私たちはこれを持っています:角度UIルーターのアクセス許可/アクセス制御

app.config(['$stateProvider', function ($stateProvider) { 

     $stateProvider 

     .state('default', { 
     url: '', 
     templateUrl: 'pages/home/view/home.html', 
     controller: 'HomeCtrl' 
     }) 

     .state('home', { 
     url: '/home', 
     templateUrl: 'pages/home/view/home.html', 
     controller: 'HomeCtrl', 

     permissions: {     // ? 
      only: ['Admin','Moderator'] 
     }, 

     access: {       // ? 
     roles: ['*'] 
     }, 

     resolve: {      // ? 
      authenticate: function($state, $q, $timeout){ 

      }, 

     } 

     }) 

}]); 

各ページへのアクセス制御を作成するためにどの方法を使用するかを決定することができません。

今、ユーザログイン角度値に格納されている:

app.value('USER', JSON.parse('{{{user}}}')); 

USERの値は、ユーザが有する役割/アクセス許可に関する情報を含んでいます。

私はUSERをapp.config()コールバックに挿入することはできません。「不明なプロバイダ」と表示されます。

USERパラメータに基づいてアクセス制御を行うにはどうすればよいですか。それはあなたがそのようなあなたのルーティング持っている場合たとえば、イベント$ stateChangeStart

であなたのアクセス制御を追加することで実行する

+1

'app.value()'は設定ブロックに挿入できません。 :https://gist.github.com/demisx/9605099#value。 –

+0

の代わりに 'app.constant()'を使用してください。これは知っておいて嬉しいですが、この場合はresolve.authenticateを使用して何かを注入できるので、その解決策は必要ありません。 –

+1

UI-Router 1.0にアップデートできる場合は、これを達成するための最善の方法は、Transition Hookです。 –

答えて

3

キー:

 .state('termsofuse', { 
      url: "/terms", 
      templateUrl: "termOfUse.html", 
      resolve: { 
       authorizedRoles: function() { 
        return [USER_ROLES['su'], 
         USER_ROLES['user'], 
         USER_ROLES['admin'], 
         USER_ROLES['skysu'] 
        ] 
       } 

      } 

     }) 

をあなたがそのようなあなたのアクセスcontroleを定義することができ

.run(
      function($rootScope, $q, $location, $window, $timeout) { 

       $rootScope.$on(
        '$stateChangeStart', 
        function(event, next, current) {      

         var authorizedRoles = next.resolve.authorizedRoles(); 

//this function controls if user has necessary roles 
         if (!isAuthorized(authorizedRoles)) { 

          event.preventDefault(); 
     // and I broadcast the news              $rootScope.$broadcast("AUTH_EVENTS.notAuthenticated"); 


         } else { 
$rootScope.$broadcast("AUTH_EVENTS.loginSuccess"); 


         } 

        }) 



      }); 

次に、イベントのキャッチャーを定義して、目的の動作(リダイレクト/エラーメッセージなど)を管理します。

0

これは私が動作させる方法です。私はそれが最良の方法であるかどうかはわかりませんが、うまくいきます。

app.config()にサービス/値を挿入することはできませんが、resolve.authenticate関数にサービス/値を挿入できます。

私はresolve.authenticateメソドロジを使用することに決めました。

.state('home', { 
    url: '/home', 
    templateUrl: 'pages/home/view/home.html', 
    controller: 'HomeCtrl', 
    resolve: { 
     authenticate: handlePageRequest['home'] // <<<< 
    } 
    }) 

し、我々はハンドラを持っている:

​​
1

あなたは、私がUI-ルータと一緒にそれを使用し、ngAAをチェックアウトする場合があります。

関連する問題