PUT 请求通过 URL 发送参数答案

【问题标题】：PUT request sending params via URLPUT 请求通过 URL 发送参数
【发布时间】：2015-08-19 18:35:35
【问题描述】：

我有一个看起来像这样的订单资源。

.factory('Order', order)

order.$inject = ['$resource', "ApiEndpoint"];

function order($resource, ApiEndpoint) {
  return $resource(ApiEndpoint.url + 'orders.json', {}, {
    create: {method: 'POST', url: ApiEndpoint.url + 'orders.json'},
    update: {method: 'PUT'},
    edit: {method: 'GET', url: ApiEndpoint.url + 'orders/edit.json'},
    remove_item: {method: 'GET', url: ApiEndpoint.url + 'orders/remove_item.json'},
  });
}

当我像这样运行Order.update 时

var params = {
  order: {
    line_items_attributes: {0: {quantity: 2, id: 1}}
  },
  order_id: 3
};

Order.update(params, function (resp, respHeaders) {
  console.log("response headers", respHeaders());
  console.log("change quantity resp", resp);
})

我也试过这个：

Order.update({}, params, function (resp, respHeaders) {
  console.log("response headers", respHeaders());
  console.log("change quantity resp", resp);
})

发送到服务器的参数最终位于 URL 内。例如，这是服务器收到的 url 之一

path="/api/mobile/orders.json?order=%7B%22line_items_attributes%22:%7B%220%22:%7B%22quantity%22:8,%22id%22:356265%7D%7D%7D"

我还应该注意，服务器接收到的方法是OPTIONS 请求。服务器已设置为处理此问题。

既然我正在发送 PUT 请求，为什么 $resource 通过 URL 传递参数而不是负载的一部分？

【问题讨论】：

标签： angularjs http params put angular-resource

【解决方案1】：

来自docs：

非 GET “类”操作：Resource.action([parameters], postData, [success], [error])

payload 是第二个参数，所以试试这段代码

var params = {
  order: {
    line_items_attributes: {0: {quantity: 2, id: 1}}
  },
  order_id: 3
};

Order.update({}, params, function (resp, respHeaders) {
  console.log("response headers", respHeaders());
  console.log("change quantity resp", resp);
})

只需添加一个空对象作为更新方法的第一个参数。

还可以查看与custom put requests相关的部分

【讨论】：

我试过了，参数仍在加载到 URL 中。
对 OPTIONS 的调用应该是由CORS 引起的，您的 api 端点是否与 Angular 应用程序位于不同的域中？
是的。我相信过去我们纠正了这个问题，因为我们过去发出 POST 请求，并且 POST 请求不会像 PUT 请求那样将参数传递到 url。
问题不在于 PUT 方法，而在于 CORS，看看这个codepen，如果你看到 put 调用，你会看到传递到请求正文中的参数
谢谢。但我仍然不知道如何解决这个问题。

【解决方案2】：

如果您要更新订单，则应指定订单 ID，以便服务现在可以更新哪个订单

function order($resource, ApiEndpoint) {
  return $resource(ApiEndpoint.url + 'orders.json/:orderid', {}, {
    create: {method: 'POST', url: ApiEndpoint.url + 'orders.json'},
    update: {method: 'PUT',params : {orderid : '@order_id'},
    edit: {method: 'GET', url: ApiEndpoint.url + 'orders/edit.json'},
    remove_item: {method: 'GET', url: ApiEndpoint.url + 'orders/remove_item.json'},
  });
}

然后是你的电话

Order.update(params, function (resp, respHeaders) {
  console.log("response headers", respHeaders());
  console.log("change quantity resp", resp);
})

【讨论】：

抱歉，参数仍在通过 URL 传递。