AngularJS - 任何方式为$ http.post发送请求参数,而不是JSON?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (77)

我有一些旧代码通过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。所以,我的问题是有无论如何告诉$http.post发送JavaScript对象作为请求参数,而不是JSON?是的,我知道我可以从对象中自己构建字符串,但是我想知道Angular是否为此提供了任何开箱即用的功能。

提问于
用户回答回答于

我认为paramsconfig参数在这里不起作用,因为它将字符串添加到url而不是body中,但是添加到Infeligo在这里提出的是默认转换的全局覆盖的示例(使用jQuery param作为转换示例数据要param字符串)。

设置全局变换请求功能:

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调用使用的相同param格式。

请注意,可能还希望设置每个呼叫的Content-Type标头或全局像这样的:

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

每次调用的非全局transformRequest示例:

    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
    });
用户回答回答于

如果使用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'
  }
});

它将正确序列化数据param1=value1&param2=value2并将其发送到/requesturlapplication/x-www-form-urlencoded; charset=utf-8Content-Type头,因为它是常与端点POST请求的预期。

扫码关注云+社区