AngularJS：通过使用复杂的JSON数据$ http.post [英] AngularJS: passing complex json data using $http.post

问题描述

我在传递一个复杂的JSON对象angularjs与$ http.post麻烦。我不断收到一个400错误的请求错误从服务器话说请求是语法不正确送回。我相信它有什么，因为我不包括它传递细做与数组。

I'm having trouble passing a complex json object in angularjs with $http.post. I'm keep getting a 400 bad request error sent back from the server saying the request was syntactically incorrect. I believe it has something to do with the array since it passes fine when i don't include it.

JSON我传递给

{
    customer: {
        firstName: "John",
        lastName: "Doe",
        street: "1234 South Dr",
        city: "Detroit",
        state: "MI",
        zip: "12345",
        phone: "123-321-1234",
        email: "[e-mail]"
    },
    order: {
        orderDate: "06-16-2015",
        registerNum: "1",
        transactionNum: "7820",
        deliveryStatusID: 1,
        notes: "Hold order until July",
        items: [
            {skuID: "1234568",
             skuDescription: "Order item 1",
             qty: "4",
             itemStatusID: 1,
             itemStatusDescription: "Backorder"
             },
            {skuID: "7387491",
             skuDescription: "Order item 2",
             qty: "1",
             itemStatusID: 1,
             itemStatusDescription: "Flagged"
            }
        ]
    }
}

角服务功能

this.addOrder = function(new_order) {
    return $http.post(base + "/add", new_order);
};

Spring MVC的控制器方法

Spring MVC controller method

@RequestMapping(value="/add", method=RequestMethod.POST)
public void addOrder(@RequestBody CustomerOrder customerOrder) {

    System.out.println("----CUSTOMER-INFO----");
    System.out.println(customerOrder.getCustomer().getFirstName());
    System.out.println(customerOrder.getCustomer().getLastName());

    System.out.println("");
    System.out.println("----ORDER-INFO----");
    System.out.println(customerOrder.getOrder().getOrderID());
    System.out.println(customerOrder.getOrder().getOrderDate());       

}

问题似乎只当我通过在JSON项阵列发生。我没有通过的项目阵列相同的JSON对象，它工作正常。该JSON格式是每当我得到一个令我angularjs服务方法获取返回，所以我真的不知道，以我这个要去哪里错了相同的格式发送。

The problem only seems to occur when I pass the items array in the json. I've passed the same json object without the items array and it works fine. The format of the json is being sent in the same format that gets returned whenever I GET an order with my angularjs service method so I'm really not sure as to where I'm going wrong with this.

如果我需要提供更多的code，请让我知道。我AP preciate在帮助我的任何努力。

If I need to provide more code please let me know. I appreciate any effort in helping me out.

感谢您。

杰森

推荐答案

在努力寻找我的错误在此问题后好了，我终于找到了解决办法。我想我会分享我如何调试和修复的情况下，其他人处于类似的情况，因为我是这个问题。

Well after struggling to find my error in this problem, I finally found a solution. I thought I'd share how I debugged and fix this problem in case someone else is in a similar situation as I was.

试图在角送我的数据到服务器，并不断获得相同的HTTP 400错误的无微不至，我决定送JSON作为一个字符串，并接受JSON作为像这样我的Spring MVC控制器的字符串。

After trying every possible way of sending my data in angular to the server and continually getting the same HTTP 400 error, I decided to send the json as a string and accept the json as a string in my spring mvc controller like this.

角服务方式：

this.addOrder = function(new_order) {
    return $http.post(base + "/add", angular.toJson(new_order));
};

春季控制器

@RequestMapping(value="/add", method=RequestMethod.POST, consumes="application/json")
public void addOrder(@RequestBody String json) {

}

在这里，我只是把传入的JSON和使用的杰克逊ObjectMapper到JSON字符串转换为我的POJO这样。

From here I simply took the json passed in and used the Jackson ObjectMapper to convert the json string to my POJO like this.

映射JSON字符串POJO

mapping json string to pojo

@RequestMapping(value="/add", method=RequestMethod.POST, consumes="application/json")
public void addOrder(@RequestBody String json) {

    ObjectMapper mapper = new ObjectMapper();

    try {

        CustomerOrder order = mapper.readValue(json, CustomerOrder.class);
        System.out.println(order.getCustomer().getFirstName() + " " + order.getCustomer().getLastName());

    } catch (JsonGenerationException e) {

        e.printStackTrace();

    } catch (JsonMappingException e) {

        e.printStackTrace();

    } catch (IOException e) {

        e.printStackTrace();

    }
}

这样做的，我运行code之后，我会努力的JSON绑定的物品到我的订单类的清单时，再上一个领域中的UnrecognizedPropertyException在我的项目类。这只是在JSON侧一个简单的拼写错误，我完全错过了。修正之后，杰克逊正确映射一切，我不再得到这个HTTP 400错误的请求是语法不正确。

After doing this and running my code, I would get an UnrecognizedPropertyException on a field in my Items class when trying to bind the items json to the List in my Order class. It was just a simple mispelling on the json side and I completely missed it. After correcting this, jackson mapped everything correctly and I no longer get this HTTP 400 Error The request was syntactically incorrect.

另外要注意的是，如果你使用JSON.stringify通过你的对象作为角字符串，你可能会遇到的hashKey领域同样异常的JSON对象。该HASHKEYS被使用的角度来监视变化。我相信你可以使用杰克逊注释忽略未知领域或者你可以简单地使用angular.toJson代替，这将删除所有为你hasKey /值这就是我所做的。

Another thing to note is that if you pass your object as a string in angular using the JSON.stringify you may encounter this same exception on hashKey field in the JSON object. The hashKeys are used by angular to monitor changes. I believe you can use a jackson annotation to ignore unknown fields or you can simply use angular.toJson instead which will remove all the hasKey/values for you which is what I did.

这篇关于AngularJS：通过使用复杂的JSON数据$ http.post的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！