AngularJS：使用$ http.post传递复杂的json数据

Question

我在使用$ http.post在angularjs中传递复杂的json对象时遇到麻烦。 我不断收到从服务器发回的400错误请求错误，说该请求在语法上是不正确的。 我相信它与数组有关，因为当我不包含它时，它可以很好地通过。

我通过的json。

{
    customer: {
        firstName: "John",
        lastName: "Doe",
        street: "1234 South Dr",
        city: "Detroit",
        state: "MI",
        zip: "12345",
        phone: "123-321-1234",
        email: "EMAIL@GMAIL.COM"
    },
    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控制器方法

@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中传递items数组时，才出现问题。 我已经传递了没有项目数组的同一个json对象，并且工作正常。 json的格式以与我每次使用angularjs服务方法获取订单时都会返回的格式相同的格式发送，因此我真的不确定我在哪里出错。

如果我需要提供更多代码，请告诉我。 感谢您为我提供的帮助。

谢谢。

杰森

Answer 1

在努力找到这个问题的错误之后，我终于找到了解决方案。 我以为我会分享如何调试和解决此问题，以防别人遇到与我相似的情况。

在尝试了将数据以一定角度发送到服务器并不断出现相同的HTTP 400错误后，我决定像这样在我的spring mvc控制器中将json作为字符串发送并接受json作为字符串。

角度服务方法：

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，并使用Jackson ObjectMapper这样将json字符串转换为我的POJO。

将json字符串映射到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();

    }
}

完成此步骤并运行我的代码后，当尝试将Items json绑定到我的Order类中的List时，我的Items类中的字段上将收到UnrecognizedPropertyException。 在json方面，这只是一个简单的拼写错误，我完全错过了它。 更正此错误后，杰克逊正确地映射了所有内容，并且我再也未收到此HTTP 400错误该请求在语法上不正确。

要注意的另一件事是，如果使用JSON.stringify将对象作为有角度的字符串传递，则在JSON对象的hashKey字段上可能会遇到相同的异常。 hashKey由angular使用，用于监视更改。 我相信您可以使用jackson批注来忽略未知字段，或者可以简单地使用angular.toJson代替，这将为您删除所有hasKey / values，这正是我所做的。

Answer 2

只是以更好的方式格式化了Json。 如果有帮助，请尝试此操作。 另外，如果可能，发布java类：

{
    "customer": {
        "firstName": "John",
        "lastName": "Doe",
        "street": "1234 South Dr",
        "city": "Detroit",
        "state": "MI",
        "zip": "12345",
        "phone": "123-321-1234",
        "email": "EMAIL@GMAIL.COM"
    },
    "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"
            }
        ]
    }
}