2014-10-01 22 views
13

Làm cách nào để chuyển hướng đến trang đăng nhập nếu ai đó cố truy cập bất kỳ tuyến đường nào khác khi chúng không được xác thực? Có cách nào "tốt nhất" để làm điều này trong AngularJS?Chuyển hướng trên tất cả các tuyến đường để đăng nhập nếu không được chứng thực

Có vẻ như một vấn đề thường gặp nhưng tôi dường như không thể tìm cách để làm điều này. Cảm ơn rất nhiều về sự trợ giúp của bạn.

+2

Tạo trình xử lý '$ routeChangeStart' hoặc' $ stateChangeStart' (cho bộ định tuyến ui), kiểm tra trạng thái xác thực, chuyển hướng đến đăng nhập nếu không được xác thực. –

+0

Cảm ơn @martoncsukas vì đã chỉnh sửa. – sturoid

Trả lời

20

Cách tốt nhất để làm điều này là thiết lập trình lắng nghe '$ routeChangeStart' kiểm tra chức năng dịch vụ 'authProvider' để xác minh rằng có người dùng đã đăng nhập. Trong 'app.js' của chúng tôi hoặc trong một tệp riêng biệt :

angular.module('myApp') 
    .run(['$rootScope', '$location', 'authProvider', function ($rootScope, $location,  authProvider) { 
     $rootScope.$on('$routeChangeStart', function (event) { 

     if (!authProvider.isLoggedIn()) { 
      console.log('DENY : Redirecting to Login'); 
      event.preventDefault(); 
      $location.path('/login'); 
     } 
     else { 
      console.log('ALLOW'); 
     } 
    }); 
}]) 

Sau đó, dịch vụ 'authProvider' của chúng tôi:

angular.module('myApp') 
    .factory('authProvider', function() { 
    var user; 
     return { 
     setUser : function(aUser){ 
      user = aUser; 
     }, 
     isLoggedIn : function(){ 
      return(user)? user : false; 
     } 
     }; 
    }); 

giải pháp này đã được tạo ra từ một câu trả lời here trên stack overflow.

Cảm ơn bạn @MohammadAwwaad

+0

Cảm ơn @ Rorschach120. Điều đó đã làm các trick. Điều duy nhất gây nhầm lẫn cho tôi là preventDefault(). Bạn có cần nó để làm việc không? Chuyển hướng đang ngăn chặn hành động mặc định và chuyển hướng để có vẻ như bạn không nhưng tôi không thể nhìn thấy điều gì đó. – sturoid

+0

+1 vì chuyển hướng đến trang đăng nhập của người dùng trái phép nhưng làm cách nào để người dùng đăng nhập qua mã phía máy chủ như php? Cách làm cho mọi trang có thể truy cập được mà không cần phải đăng nhập, ví dụ: trang đăng ký? –

+3

http://stackoverflow.com/questions/20969835/angularjs-login-and-authentication-in-each-route-and-controller?rq=1 –

0

tôi đang làm điều này một cách khác nhau bây giờ, với Node.js & nhanh & module passport, nhưng trước đó, khi tôi đang sử dụng PHP, tôi đã làm nó với một số module góc. Tôi có một mô-đun bên ngoài trên thẻ <html> của mình với ng-app, sau đó ng-controller s tại các thẻ nhất định, như <body> & nhất định <div> s. Trong một trong số ng-controller s này, tôi đã có chức năng xác thực, sau đó tôi đã có một ng-if để đăng nhập, đăng xuất, v.v. Nếu người dùng chưa đăng nhập, tôi ẩn trang hiện tại và ng-include d trang thích hợp. Nếu không, tôi ng-include d trang hiện tại.

Đó có lẽ không phải là giải pháp tốt nhất, nhưng tôi không muốn sử dụng các mô-đun của bên thứ ba. Nếu bạn bị nhầm lẫn hoặc có bất kỳ câu hỏi nào (tôi biết tôi khá bối rối) chỉ cần hỏi.

+0

Tôi cũng làm như thế này. Kiểm soát các mẫu có thể nhìn thấy với một biến trong một bộ điều khiển chính bên ngoài toàn bộ điều. Sau đó, tôi nhận ra đó là chính xác những gì 'ng-view' là cho, vì vậy tôi tryna sử dụng mà thay vào đó. – tscizzle

Các vấn đề liên quan