AngularJs -.net Ví dụ về xác thực WebApi MVC

Question

Tôi có ứng dụng Net MVC WebApi và cố gắng viết giao diện người dùng độc quyền trong Angularjs. Tôi có thể lấy dữ liệu thông qua json và thao tác nó nhưng bây giờ tôi cần phải bảo mật dữ liệu và đã thêm xác thực Base64 vào các tiêu đề trên máy chủ. Khi tôi duyệt đến một số trang kiểm tra xem .net của tôi, tôi nhận được hộp đăng nhập thích hợp yêu cầu người dùng/pass để tôi có thể tiếp tục nhận được json.

Điều tôi không biết phải làm là chuyển thông tin này (người dùng/mật khẩu) trong tiêu đề mà góc được thiết lập trong tài nguyên $ của tôi. Có bất kỳ ví dụ hoàn chỉnh nào có thể chỉ cho tôi cách thực hiện điều này tốt hơn không? Tôi biết nó liên quan đến các tập tin cookie và sử dụng mã thông báo máy chủ trả lại nhưng tôi không biết làm thế nào để đặt các mảnh lại với nhau.

Khi tôi nhận được tất cả điều này cùng nhau tôi hy vọng sẽ đăng một ví dụ hoàn chỉnh bộ xương này qua tất cả các lớp (DAL, RESTFUL, lớp kiểm tra giao diện điều khiển).

Vì vậy, câu hỏi đặt ra là - làm thế nào để bạn chèn thông tin xác thực vào tiêu đề trên máy khách khi sử dụng tài nguyên AngularJS $?

Cảm ơn

Answer 1

Nếu bạn đặt một cookie trong tiêu đề trên AngularJS phía máy chủ sẽ gửi cookie này mọi thời đại .. U có gì để làm.

Nếu bạn muốn chuyển mã thông báo trong Tiêu đề không có trong cxookie trên Góc cạnh, hãy thực hiện điều này: $httpProvider.defaults.headers.common['X-Auth'] = yourKey; trong khối cấu hình của bạn.

Sau đó, nếu bạn muốn biết liệu người dùng có đăng nhập hay không hoặc liệu anh ta có quyền chỉ thực hiện một kẻ đánh chặn hay không. Đó là một nhà máy đơn giản mà bạn sẽ đẩy trong responseIntercetors luôn trong khối cấu hình của bạn.

nhà máy này sẽ lắng nghe mỗi câu trả lời từ máy chủ và tình hình thực hiện của mình bạn sẽ kiểm tra mã trạng thái của phản ứng trong trường hợp lỗi:

401 -> chưa đăng 403 -> không cho phép

ví dụ về nhà máy:

myModule.factory('myHttpInterceptor', function ($q) { 
    return function (promise) { 
     return promise.then(function (response) { 
      // do something on success    
      return response; 
     }, function (response) { 
      // do something on error 
      //check status 401 or 403 
      return $q.reject(response); 
     }); 
    }; 
}); 

Sau đó đặt nhà máy của bạn trong responseIntercetors http như thế này trong con vả khối của bạn:

myModule.config(function ($httpProvider) { 
    $httpProvider.responseInterceptors.push('myHttpInterceptor'); 
}); 

Chỉ cần ghi nhớ giải pháp này không được chấp trong AngularJS 1.1.4 (vẫn không ổn định) ...

Nhà máy phải có một chút khác nhau chỉ cần tham khảo bài này để biết thêm thông tin: AngularJS Intercept all $http JSON responses

Hy vọng nó sẽ giúp