【问题标题】:Passing an ID and String array to Spring MVC via jQuery/ajax+JSON通过 jQuery/ajax+JSON 将 ID 和字符串数组传递给 Spring MVC
【发布时间】:2015-01-12 06:43:05
【问题描述】:

我需要通过 jQuery.ajax() 将请求发布到 Spring MVC 控制器 URL 映射方法并接收响应;请求和响应数据都是 JSON 格式。

Ajax 调用是这样的:

$.ajax({
    url: "/panelsData",
    dataType: "json",
    data: { "id": 1, "panels": [ "View1", "View2", "View3" ] },
    success: function(data) {...}
});

Spring MVC 控制器 URL 映射方法:

@RequestMapping(value="/panelsData", method = RequestMethod.POST,
        produces = MediaType.APPLICATION_JSON_VALUE,
        consumes = MediaType.APPLICATION_JSON_VALUE)
@ResponseStatus(value=HttpStatus.OK)
@ResponseBody
public List<PanelData> getPanelsDataById(
         @RequestParam("id") BigDecimal id,
         @RequestParam("panels") List<String> panelsList) {

    // Process list of Strings corresponding to panel view names
    // and return a list of PanelData objects (in JSON format).
}

我遇到的第一个问题是客户端(浏览器)失败,错误代码为 400(错误请求)。所以,我在 ajax 调用中对数组进行了 JSON.stringify:

data: { "id": 1, "panels": JSON.stringify([ "View1", "View2", "View3" ]) },

这一次,请求被Spring MVC成功接收。但是字符串值列表有问题。当我检查这些值时,我看到的是:

panelsList[0] = ""[View1""
panelsList[1] = ""View2""
panelsList[2] = ""View3]""

什么?!我期待这些值:

panelsList[0] = "View1"
panelsList[1] = "View2"
panelsList[2] = "View3"

我是否错误地序列化(或反序列化)这些值?鉴于数据交换必须全部是 JSON,并且我使用的是 Jackson 库,我希望从客户端以 JSON 格式接收 ID 和字符串值列表应该不会那么困难。我知道 Jackson 库配置是完美的,因为其他方法返回的 JSON 响应格式正确。

【问题讨论】:

  • 如果您从 json 传递数据,您必须了解第一个也是非常重要的事情,您具有相同的数据类型和模式......就像这里我正在创建方法签名基于 json 数据 public PanelData getPanelsDataById(@RequestParam("id") BigDecimal id, @RequestParam("panels") List panelList)

标签: jquery ajax json spring-mvc


【解决方案1】:

我认为如果你能像下面这样重构你的代码会更好。

您可以创建 PanelDataJson 类,而不是在单独的参数中传递/接收它们,它包含面板的 id 和列表。

class PanelDataJson{
    BigDecimal id;
    List<String> panelsList;

     //Getter and Setter

}

然后像下面这样改变你的方法。

@RequestMapping(value="/panelsData", method = RequestMethod.POST,
        produces = MediaType.APPLICATION_JSON_VALUE,
        consumes = MediaType.APPLICATION_JSON_VALUE)
@ResponseStatus(value=HttpStatus.OK)
@ResponseBody
public List<PanelData> getPanelsDataById(
         @RequestBody PanelDataJson) {

    // Process list of Strings corresponding to panel view names
    // and return a list of PanelData objects (in JSON format).
}

从您的前端,只需对整个数据进行字符串化,而不是部分数据。

$.ajax({
    url: "/panelsData",
    dataType: "json",
    data: JSON.stringify({ "id": 1, "panels": [ "View1", "View2", "View3" ] }),
    type: "POST",
    contentType : 'application/json; charset=utf-8',
    success: function(data) {...}
});

【讨论】:

  • 如果我绝对不想创建一个新类,以下也对我有用 - 在 Ajax 调用的选项中,添加 traditional: true 和数据选项,data: $.param({ "id": 1, "panels": [ "View1", "View2", "View3" ] }, true)。
  • 非常有帮助的@WebUser,非常感谢这种方法和问题。我想问一件事,设置 "traditional:true" 是有害的还是不安全的?
猜你喜欢
  • 1970-01-01
  • 2015-06-28
  • 2014-09-27
  • 2018-11-02
  • 2021-04-14
  • 2011-07-26
  • 1970-01-01
  • 1970-01-01
  • 2011-02-12
相关资源
最近更新 更多