Angularjs - tùy chỉnh $ resource

Question

Tôi sử dụng Angular $resource cho dịch vụ REST. Do sự lừa đảo trong phản hồi của tôi, tôi không thể sử dụng dịch vụ tài nguyên $ cho ứng dụng CRUD.

Tạo một tác phẩm đối tượng mới (nói cho Card), smilar để:

var newCard = new CreditCard(); 
newCard.name = "Mike Smith"; 
newCard.$save(); 

Get cũng làm việc:

var card = CreditCard().get({_id:1) 

Nhưng, phản ứng GET không phải là đối tượng Card chính nó, nhưng khác tin nhắn với nó (đối tượng bao bọc)

{ message: ".....", 
    response: Card //object 
} 

vì vậy khi tôi lưu truy xuất mẫu ved thông qua tài nguyên, nó sẽ gửi đối tượng bao bọc (với đối tượng Thẻ đã sửa đổi trong trường phản hồi). Điều này có thể đúng, nhưng máy chủ của tôi mong đợi đối tượng Thẻ không phải là trình bao bọc. Có cách nào để tùy chỉnh $ tài nguyên để nó gửi đối tượng mong muốn không. Từ tài liệu, có vẻ như chỉ có thể thay đổi thông số url.

$resource(url[, paramDefaults][, actions]); 

Answer 1

Tôi cũng gặp sự cố với việc triển khai chuẩn trong mô-đun tài nguyên $. Trong một thời gian, tôi chỉ thực hiện các chỉnh sửa trong bản sao cục bộ của tập tin tài nguyên $, nhưng tôi thấy rằng tôi vẫn không hài lòng với cách họ triển khai các tài nguyên REST. Tôi cần sự linh hoạt hơn được cung cấp.

Mô-đun tiêu chuẩn $resource chỉ là trình bao bọc nhà máy khoảng $ http. Nếu bạn đun sôi mã trong mô-đun $ resource, bạn có thể tạo việc triển khai tùy chỉnh của riêng bạn khá dễ dàng.

var app = angular.module('app', []); 

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

    function CreditCardFactory() { 

     function parseMessage(message) { 
      if (message.response) { 
       return message.response; 
      } 
     } 

     function CreditCard(value) { 
      angular.copy(value || {}, this); 
     } 

     CreditCard.$get = function(id) { 
      var value = this instanceof CreditCard ? this : new CreditCard(); 
      $http({ 
       method: 'GET', 
       url: '/creditcards/' + id 
      }).then(function(response) { 
       var data = response.data; 
       if (data) { 
        angular.copy(parseMessage(data), value); 
       } 
      }); 
      return value; 
     }; 

     CreditCard.prototype.$get = function(id) { 
      CreditCard.$get.call(this, id); 
     }; 

     return CreditCard; 

    } 

    return CreditCardFactory; 

}]); 

Sau đó, trong chức năng điều khiển của bạn, hãy tiêm nhà máy thẻ tín dụng giống như bạn sẽ tài nguyên $.

app.controller('CreditCardCtrl', function($scope, CreditCard) { 
    $scope.creditCard = CreditCard().get(3); 
}); 

Điều này cho phép bạn phân tích cú pháp các phản hồi của các hành động REST bạn muốn và cũng cho phép bạn thực hiện bất kỳ hành động nào bạn muốn. Ví dụ: Tôi muốn một phương thức lưu trên tài nguyên của tôi sẽ kiểm tra xem đối tượng có thuộc tính id hay không trước khi chọn sử dụng POST (tạo tài nguyên mới khi không có id) hoặc PUT (cập nhật tài nguyên hiện có khi id hợp lệ có sẵn).

Điều này cũng sẽ cho phép bạn thực hiện một cách xử lý khác nhau JSON CSRF Vulnerability. Cách angular.js được xây dựng thành $ http, nhưng API REST của công ty tôi khắc phục vấn đề này bằng cách bao bọc các mảng JSON trong một đối tượng giả. Tôi sử dụng một tài nguyên tùy chỉnh như một ở trên để phân tích đối tượng giả.