AngularJS - ログインページへのリダイレクトとセッションIDの永続性

Question

私はこれらの2つのことを行う方法を探しています。まず、セッションIDが見つからない場合にユーザーをログインページにリダイレクトしたいと思います。セッションIDをメモリのみに保持することに関する意見（クッキーなし）。

私はリダイレクトのために思い付いた解決策は以下のとおりです。

1 - サービスはセッションIDが存在しない場合は、ログインページにリダイレクトするかどうかをチェックしますのOAuthと呼ば作成し、サービスもログインを担当し、ログアウト方法。

app.factory('OAuth', ['$http', function ($http) { 

    var _SessionID = ''; 

    return { 
     login: function() { 
      //Do login ans store sessionID in var _SessionID 
     }, 

     logout: function() { 
      //Do logout 
     }, 

     isLoggedIn: function() { 
      if(_SessionID) { 
       return true; 
      } 
      //redirect to login page if false 
     } 
    }; 

}]); 

2 - 各コントローラに新しいOAuthのサービスを注入し、チェックするユーザisLoggedIn

app.controller('myCtrl', ['$scope', 'OAuth', function ($scope, OAuth) { 

    //check if user is logged 
    OAuth.isLoggedIn(); 

}]); 

質問：

1 - isLoggedIn（）メソッドは、すべてのコントローラに呼び出されるので、サービスを注入して各コントローラに呼び出さなくても、これを行う方法があるのだろうかと思います。

2 - 私はそれをOAuthの_SessionID変数に保存したいと思いますし、リクエストごとにサーバーに送信したいのです。これは実行可能/安全なアプローチですか？あなたは私にそれのためのいくつかのアイデアを与えることができます

ありがとうございます！

Answer 1

私はhereを開始しますが、WitoldはHTTPレスポンスで動作するこの素晴らしいインターセプタを作成しました。私はそれを使用して、本当に役立っています。

Answer 2

私は同様の戦略を使用します（サーバーからの401応答を傍受します）。あなたがここに完全な例をチェックアウトすることができます：

を： https://github.com/Khelldar/Angular-Express-Train-Seed

をこれは、セッションストアとダンは、上記のリンクのような要求を再試行してくださいdoens'tクライアント上のhttpダウントリミング迎撃のためのバックエンドでのノードとmobgodbを使用しています私の場合は

var interceptor = ['$q', '$location', '$rootScope', function ($q, $location, $rootScope) { 
     function success(response) { 
      return response; 
     } 

     function error(response) { 
      var status = response.status; 
      if (status == 401) { 
       $location.path('/login'); 
      } 
      return $q.reject(response); 
     } 

     return function (promise) { 
      return promise.then(success, error); 
     } 
    }]; 
    $httpProvider.responseInterceptors.push(interceptor); 

Answer 3

、私は$ httpProvider

設定

と$ウィンドウで

1. インターセプタを依存して使用しました$ locationは既存のURLへのパスを追加しただけです。何が起こったことは、「http://www.tnote.me/#/api/auth」のようだった、それは「http://www.tnote.me/auth」

ようなコードスニペットを恩恵を受けるている必要があります。このようなものです。

noteApp = angular.module('noteApp', ['ngRoute', 'ngCookies']) 
    .factory('authInterceptor', ['$rootScope', '$q', '$cookies', '$window', 
    function($rootScope, $q, $cookies, $window) { 
     return { 
     request: function (req) { 
      req.headers = req.headers || {}; 
      if ($cookies.token) { 
      req.headers.Authorization = 'Bearer ' + $cookies.token; 
      } 

      return req; 
     }, 
     responseError: function (rejection) { 
      if (rejection.status == 401) { 
      $window.location = '/auth';  
      } 

      return $q.reject(rejection); 
     } 
     } 
    }]) 
    .config(['$routeProvider', '$httpProvider', function($httpProvider) { 
    $httpProvider.interceptors.push('authInterceptor'); 
    } 
    ]) 

Answer 4

これは動作します。それは私のアプリケーション

var interceptor = function ($q, $location) { 
     return { 
      request: function (config) {//req 
       console.log(config); 
       return config; 
      }, 

      response: function (result) {//res 
       console.log('Repos:'); 
       console.log(result.status); 
       return result; 
      }, 

      responseError: function (rejection) {//error 
       console.log('Failed with', rejection.status, 'status'); 
       if (rejection.status == 403) { 
        $location.url('/dashboard'); 
       } 

       return $q.reject(rejection); 
      } 
     } 
    }; 
    module.config(function ($httpProvider) { 
     $httpProvider.interceptors.push(interceptor); 
    });