41

我正在尝试将一个对象作为 JSON 发送到我在 Flask 中的 web 服务，该服务期望请求数据中包含 JSON。

我已经通过发送 JSON 数据手动测试了该服务，它工作正常。但是，当我尝试通过角度控制器发出 http POST 请求时，Web 服务器会向我发送一条消息，说它没有收到 JSON。

当我在 Chrome 中检查请求标头时，似乎数据不是以 JSON 格式发送的，而是常规键/值对，即使内容类型设置为 application/json

Request Method:POST
Status Code:200 OK
Request Headersview source
Accept:application/json, text/plain, */*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:49
Content-Type:application/json;charset=UTF-8
DNT:1
Host:localhost:5000
Origin:http://localhost:5000
Referer:http://localhost:5000/
User-Agent:Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.116 Safari/537.36
X-Requested-With:XMLHttpRequest
Request Payload
application=AirFare&d1=10-APR-2013&d2=14-APR-2013

如果您看到 Request Payload 下面的最后一行，您可以看到数据不是 JSON 格式。

这是我的角度控制器中的 HTTP POST 调用：

$http({
            url: '/user_to_itsr',
            method: "POST",
            data: {application:app, from:d1, to:d2},
            headers: {'Content-Type': 'application/json'}
        }).success(function (data, status, headers, config) {
                $scope.users = data.users; // assign  $scope.persons here as promise is resolved here 
            }).error(function (data, status, headers, config) {
                $scope.status = status + ' ' + headers;
            });
};

我将数据作为对象 {} 发送，但我尝试在通过 JSON.stringify 序列化后发送它，但是，我似乎没有将 JSON 发送到服务器。

如果有人可以提供帮助，我真的很感激。

4

7 回答 7

49

如果您正在序列化您的数据对象，它将不是一个正确的 json 对象。拿走你所拥有的，然后将数据对象包装在一个JSON.stringify().

$http({
    url: '/user_to_itsr',
    method: "POST",
    data: JSON.stringify({application:app, from:d1, to:d2}),
    headers: {'Content-Type': 'application/json'}
}).success(function (data, status, headers, config) {
    $scope.users = data.users; // assign  $scope.persons here as promise is resolved here 
}).error(function (data, status, headers, config) {
    $scope.status = status + ' ' + headers;
});
于 2013-07-09T18:58:17.947 回答
10

我已经尝试了您的示例，并且效果很好：

var app = 'AirFare';
var d1 = new Date();
var d2 = new Date();

$http({
    url: '/api/test',
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    data: {application: app, from: d1, to: d2}
});

输出：

Content-Length:91
Content-Type:application/json
Host:localhost:1234
Origin:http://localhost:1234
Referer:http://localhost:1234/index.html
User-Agent:Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.66 Safari/537.36
X-Requested-With:XMLHttpRequest
Request Payload
{"application":"AirFare","from":"2013-10-10T11:47:50.681Z","to":"2013-10-10T11:47:50.681Z"}

您使用的是最新版本的 AngularJS 吗？

于 2013-10-10T11:56:45.953 回答
2

你可以通过这种方式使用你的方法 

var app = 'AirFare';
var d1 = new Date();
var d2 = new Date();

$http({
    url: '/api/apiControllerName/methodName',
    method: 'POST',
    params: {application:app, from:d1, to:d2},
    headers: { 'Content-Type': 'application/json;charset=utf-8' },
    //timeout: 1,
    //cache: false,
    //transformRequest: false,
    //transformResponse: false
}).then(function (results) {
    return results;
}).catch(function (e) {

});
于 2014-08-12T03:41:00.400 回答
2

您可以使用 FormData API https://developer.mozilla.org/en-US/docs/Web/API/FormData 

var data = new FormData;
data.append('from', from);
data.append('to', to);

$http({
    url: '/path',
    method: 'POST',
    data: data,
    transformRequest: false,
    headers: { 'Content-Type': undefined }
})

这个解决方案来自http://uncorkedstudios.com/blog/multipartformdata-file-upload-with-angularjs

于 2014-05-09T14:12:26.880 回答
0

尝试使用绝对网址。如果它不起作用，请检查服务的响应是否有标头：

Access-Control-Allow-Origin 和 Access-Control-Allow-Headers

例如：

"Access-Control-Allow-Origin": "*"
"Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept"
于 2016-05-04T15:13:11.657 回答
-1

您可以使用以下内容查找发布的数据。

data = json.loads(request.raw_post_data)

于 2015-02-12T05:44:19.333 回答
-1 
$http({
    url: '/api/user',
    method: "POST",
    data: angular.toJson(yourData)
}).success(function (data, status, headers, config) {
    $scope.users = data.users;
}).error(function (data, status, headers, config) {
    $scope.status = status + ' ' + headers;
});
于 2016-10-24T20:22:25.173 回答