日報クラウドnipoでは、ログインをする処理が書かれています。
当然ですね。あなたが誰なのかわからないと、どの日報を表示したらいいかわからんもの。
なので、ログインしてもらうことで、あなたが誰かを特定するわけです。
SPA（シングルページアプリケーション）は、これまでのWebとちょっと考えが違う
ので、ログインのからくりも少し考える必要があります。
今回は、Angular JS + ui-routerを前提にお話します。
実際の動作するプログラムはnipoのホームページから確認してください
Angular JSは、ページ遷移の機能が若干貧弱なので、
外部プラグインであるUI-routerを使うのが通なのです。
Angura通を名乗りたければUI-routerを使うべきです。
さて、UI-routerを使ったログインページの仕組みです
.config(function ($stateProvider, $urlRouterProvider ) {
$urlRouterProvider.otherwise("/");
$stateProvider
.state('/', {
url: "/",
views: {
"viewA": { templateUrl: "views/main.html" ,controller:"MainCtrl" },
},
loginRequied:true,
})
})
//中略〜
.run(function($rootScope , $state ){
$rootScope.$on('$stateChangeStart', function(e, toState, toParams, fromState, fromParams){
//ログイン要求ページはログインしていない場合ログインフォームへ飛ばす
if (toState.loginRequid) {
if (/*ログイン済みかをここでチェックする*/) {
//ログインしていない
$state.go('/login');
e.preventDefault();
return ;
}
}
})
})
ポイントはloginRequied:trueの部分です。
ログインが必要なページには、loginRequid:trueを付けておきます。
toState.loginRequidが真のとき、
ログイン済みかチェックをします。未ログインの場合はログインページヘ飛ばします。
e.preventDefault();で標準の挙動（本来のページ遷移）をキャンセルするのも忘れずに。
同じ仕組で、例えば管理者権限が必要なページであればadminRequied:trueとか
適当な名前を付けて作ってあげればいいのです。
そして同じようにtoState.adminRequiedとしてチェックします。
nipoの場合、グローバルメニューが常に表示されている（ログイン前でも）ので、
未ログイン時に、グローバルメニューが押されても、ページが遷移しないように
しています。
実際の動作例はこちらで確認できます
グローバルメニューを押してもページが遷移しないはずです。確認してください
