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


问题内容

我在使用$
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服务方法获取订单时都会返回的格式相同的格式发送,因此我真的不确定我在哪里出错。

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

谢谢。

杰森


问题答案:

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

在尝试了将数据以一定角度发送到服务器并不断出现相同的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,这正是我所做的。