AngularJS - Chuyển hướng đến trang Đăng nhập và Độ bền của ID phiên

Question

Tôi đang tìm cách thực hiện hai điều này, trước tiên tôi muốn chuyển hướng người dùng đến trang đăng nhập nếu không tìm thấy SessionID và thứ hai tôi muốn nghe ý kiến ​​về việc duy trì ID phiên trong bộ nhớ chỉ (không có cookie).

Các giải pháp tôi đã đưa ra để chuyển hướng là:

1 - Tạo một dịch vụ gọi là OAuth rằng sẽ kiểm tra nếu SessionID tồn tại và nếu không, chuyển hướng đến trang đăng nhập, dịch vụ cũng chịu trách nhiệm về đăng nhập và phương thức đăng xuất.

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 - Tiêm dịch vụ OAuth mới trong mỗi bộ điều khiển và kiểm tra xem người dùng isLoggedIn

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

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

}]); 

Câu hỏi:

1 - Phương pháp isLoggedIn() sẽ được gọi trong tất cả các bộ điều khiển, vì vậy Tôi tự hỏi nếu có một cách để làm điều này mà không cần phải tiêm dịch vụ và gọi nó trong mỗi bộ điều khiển.

2 - Thay vì có cookie để lưu sessionID, tôi muốn lưu nó trong biến _SessionID của OAuth và cho mỗi yêu cầu gửi nó đến máy chủ. Đây có phải là cách tiếp cận khả thi/an toàn không? Bạn có thể cho tôi một số ý tưởng cho điều đó không?

Cảm ơn!

Answer 1

Tôi sẽ bắt đầu here, Witold đã tạo trình chặn đánh dấu mát mẻ này hoạt động ngoài phản hồi http. Tôi sử dụng nó và nó thực sự hữu ích.

Answer 2

Tôi sử dụng một chiến lược tương tự (chặn 401 phản hồi từ máy chủ). Bạn có thể kiểm tra đầy đủ các ví dụ ở đây: https://github.com/Khelldar/Angular-Express-Train-Seed

Nó sử dụng nút và mobgodb trên backend cho cửa hàng phiên và tỉa xuống http đánh chặn trên máy khách mà doens't thử lại yêu cầu như một Dan liên kết ở trên:

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

Trong trường hợp của tôi, tôi đã sử dụng

1. đánh chặn với $ httpProvider
2. cấu hình
3. và $ cửa sổ phụ thuộc mã hóa, vì $ location chỉ thêm đường dẫn vào url hiện có. Điều gì đã xảy ra giống như "http://www.tnote.me/#/api/auth" và phải có dạng như "http://www.tnote.me/auth"

Đoạn mã giống như thế này.

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

điều này sẽ hoạt động. Nó hoạt động tốt trong ứng dụng của tôi

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); 
    });