AngularJS - $http.post 发送请求参数而不是JSON有什么方法吗？

javascript jquery angularjs post

2022-08-30 05:17:00

我有一些旧代码通过jQuery的post方法发出AJAX POST请求，看起来像这样：

$.post("/foo/bar", requestData,
    function(responseData)
    {
        //do stuff with response
    }

requestData只是一个具有一些基本字符串属性的 javascript 对象。

我正在将我们的东西移到使用Angular的过程中，我想用$ http.post 替换这个调用。我想出了以下几点：

$http.post("/foo/bar", requestData).success(
    function(responseData) {
        //do stuff with response
    }
});

当我这样做时，我从服务器收到了500错误响应。使用Firebug，我发现这发送了这样的请求正文：

{"param1":"value1","param2":"value2","param3":"value3"}

成功的 jQuery 会像这样发送正文：$.post

param1=value1&param2=value2&param3=value3

我命中的终结点需要请求参数，而不是 JSON。所以，我的问题是，无论如何都要告诉将javascript对象作为请求参数而不是JSON发送吗？是的，我知道我可以从对象中自己构造字符串，但我想知道Angular是否提供了开箱即用的东西。$http.post

答案 1

我认为config参数在这里不起作用，因为它将字符串添加到url而不是正文，但是要添加到Infeligo建议的内容中，这里是默认转换的全局覆盖的示例（使用jQuery参数作为将数据转换为参数字符串的示例）。params

设置全局转换请求函数：

var app = angular.module('myApp');

app.config(function ($httpProvider) {
    $httpProvider.defaults.transformRequest = function(data){
        if (data === undefined) {
            return data;
        }
        return $.param(data);
    }
});

这样，所有对 $http.post 的调用都会自动将正文转换为 jQuery 调用使用的相同参数格式。$.post

请注意，您可能还希望为每个呼叫设置 Content-Type 标头，如下所示：

$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';

示例非全局转换每个调用的请求：

    var transform = function(data){
        return $.param(data);
    }

    $http.post("/foo/bar", requestData, {
        headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
        transformRequest: transform
    }).success(function(responseData) {
        //do stuff with response
    });

答案 2

如果使用Angular >= 1.4，以下是我发现的最干净的解决方案，它不依赖于任何自定义或外部：

angular.module('yourModule')
  .config(function ($httpProvider, $httpParamSerializerJQLikeProvider){
    $httpProvider.defaults.transformRequest.unshift($httpParamSerializerJQLikeProvider.$get());
    $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=utf-8';
});

然后，您可以在应用中的任何位置执行此操作：

$http({
  method: 'POST',
  url: '/requesturl',
  data: {
    param1: 'value1',
    param2: 'value2'
  }
});

它将正确地将数据序列化为，并使用 Content-Type 标头将其发送到，就像终结点上的 POST 请求通常预期的那样。param1=value1&param2=value2/requesturlapplication/x-www-form-urlencoded; charset=utf-8