繁体   English   中英

AngularJS $ http.post与body

[英]AngularJS $http.post with body

我有CordovaAngularJS的应用程序。

使用Angular,我将一个值发送到我的后端应用程序( Spring REST )。 我用它的方法是$ http.post


问题

当我尝试将数据发送到我的服务器时,Spring不会在我的实体中设置值。 由于这个原因,我无法保存我的新数据。


角度代码

我的AngularJS代码如下:

httpService.createInBackend = function (url, data, callback, errorCallback) {
    http.post(url, data)
           .then(function (success) {
              callback(success);
           }, function (error) {
              errorCallback(error.data);
           });
};

我使用以下参数:

url: http://<location>:<port>/<application>/<web_socket_url>

数据:

data: {
        {
        "incidentTypeId": 5,
        "priorityId": 1,
        "creationDate": 1449676871234,
        "userId": 1,
        "latitude": <some valid location>,
        "longitude": <some valid location>
        }
    },
    timeout: 4000
}

我使用' data '而不是' params ',因为我想通过正文发送数据。 我得到了这个与PUT功能一起使用,与此功能没有多大区别。


我的REST控制器

 @RequestMapping(value = "/employee/new", method = RequestMethod.POST)
    public NewEmployee createIncident(@RequestBody NewEmployee employee) {

    return employee;
}

我的NewEmployee模型

private int employeeId;

private int priorityId;

private String information;

private Date creationDate;

private int userId;

private float longitude;

private float latitude;

角度结果

使用控制台时,我从此方法获得以下结果:

我发送:

{
     "employeeId":5,
     "priorityId":1,
     "creationDate":1449677250732,
     "userId":1,
     "information": "hello world!",
     "latitude":<some valid location>,
     "longitude":<some valid location>
}

我收到:

{  
     employeeId: 0
     priorityId: 0
     creationDate: null
     userId: 0
     information: null
     latitude: 0
     longitude: 0   
}

邮差

我用PostMan( 谷歌Chrome插件 )尝试了同样的事情,这样我的代码就可以了。 因此,我认为这是我的AngularJS代码的问题。


我努力了

我尝试过使用以下AngularJS调用:

$http({
    method: 'POST',
    url: url,
    data: data,
    timeout: 4000
}).then(function (success) {
    callback(success);
}, function (error) {
    errorCallback(error);
});

然而,这并没有改变结果。 仍然只是空值。


有谁知道我做错了什么?

你试过没有速记版的$ http吗? 我认为如果您使用类似的东西,您的代码将会起作用

$http({
  method: 'POST',
  url: url,
  data: JSON.stringify(data)
})
.then(function (success) {
  callback(success);
}, function (error) {
  errorCallback(error.data);
});

哪里

data = {
     "employeeId":5,
     "priorityId":1,
     "creationDate":1449677250732,
     "userId":1,
     "information": "hello world!",
     "latitude":<some valid location>,
     "longitude":<some valid location>
}

进一步阅读......

更新的代码

更改$ http.post后:

httpService.createInBackend = function (url, data, callback, errorCallback) {
    http.post(url, data)
           .then(function (success) {
              callback(success);
           }, function (error) {
              errorCallback(error.data);
           });
};

标准$ http类型的角度:

$http({
    method: 'POST',
    url: url,
    data: data
}).then(function (success) {
    callback(success);
}, function (error) {
    errorCallback(error);
});

在身体中发送我的数据仍然无法正常工作。


$ http请求的这种标准方式的问题是它不接受如下对象:

data: {
        {
        "incidentTypeId": 5,
        "priorityId": 1,
        "creationDate": 1449676871234,
        "userId": 1,
        "latitude": <some valid location>,
        "longitude": <some valid location>
        }
    },
    timeout: 4000
}

我不得不改为:

var incidentInformation = {
    incidentTypeId: $scope.selectedIncident.id,
    priorityId: $scope.priorityId,
    information: $scope.information,
    creationDate: Date.now(),
     userId: JSON.parse(localStorage.getItem('user')).id,
     latitude: location.latitude,
     longitude: location.longitude       
};

并添加一个新行:

incidentInformation = JSON.stringify(incidentInformation);

我可以直接将此值设置为数据值:(超时必须以这种方式完成,不能在数据对象中设置)

$http({
   method: 'POST',
   url: url,
   data: incidentInformation,
   timeout: 4000
}).then(function (success) {
   callback(success);
}, function (error) {
   errorCallback(error);
});

通过这个更改的代码,后端现在正确地接收了数据,我的应用程序能够保存数据。

感谢Yoogeeks建议的标准方法。 奇怪的是,AngularJS $ http。“某些方法”的工作方式与标准方法不同。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM