文档章节

Gson解决前端多层数据封装与后台Controller层数据接收

pocher
 pocher
发布于 2017/04/03 18:54
字数 313
阅读 31
收藏 1

问题描述:工作上遇到了一个小问题,前端页面用的是一个大对象,封装了4个数组,每个数组里又放了不同的对象。然后后端Controller也是按同样的层次结构和属性名称接收的,但就是接收不到数据。

例子:

前端JS代码

var user={};
var imageArray = [];
var textArray = new Array();

$("*[name=img_url]").each(function (i, n) {
   var _obj = $(this);
   var img_url = _obj.val();
   if (img_url!=""&&img_url!=null) {
      var ImageVo ={};
      ImageVo.imageurl=img_url;
      imageArray.push(ImageVo);
   }
 });

$("*[name=text]").each(function (i, n) {
   var _obj = $(this);
   var textInfo= _obj.val();
   if (text!=""&&text!=null) {
      var textVo ={};
      textVo .text=textInfo;
      textArray .push(textVo);
   }
});

user.images  = imageArray;
user.texts  = imageArray;
var jsonData = {
   "user":user
};
$.ajax({
   type : "post",
   url: "/test",
   dataType:"json",
   cache:false,
   async:false,
   data: "use="+JSON.stringify(user),
   success:function(data){
      代码逻辑...
   }
});

后台是这样接收的:

VO类:

public class UserVo {
    private  List<ImageVo> images = new ArrayList<ImageVo>();
    private  List<TextVo> texts = new ArrayList<TextVo>();
    
    此处省略了get/set方法
}
public class ImageVo {
    private String imageurl;

     此处省略了get/set方法
}
public class TexteVo {
    private String text;

     此处省略了get/set方法
}

Controller:

@RequestMapping(value = "/test", method = RequestMethod.POST)
public @ResponseBody Map<String, Object>test(String user) {
   Gson gson = new Gson();
   Use user = gson.fromJson(user,
         new TypeToken<UserVo>() {
         }.getType());
}

总结:前端现将数据转换成JSON,传到后台,然后通过Gson再将JSON转回对应的对象

© 著作权归作者所有

pocher
粉丝 6
博文 36
码字总数 24616
作品 0
昌平
程序员
私信 提问
系列四、SpringMVC响应数据和结果视图

项目结构如下 一、返回值分类 一 返回字符串 Controller方法返回字符串可以指定逻辑视图的名称,根据视图解析器为物理视图的地址,根据字符串最后跳转到对应jsp页面 第一步、导入依赖坐标文件...

我叫小糖主
05/29
18
0
Web前端框架与类库的思考

说起前端框架,我也是醉了。现在去面试或者和同行聊天,动不动就这个框架碉堡了,那个框架好犀利。   当然不是贬低框架,只是有一种杀鸡焉用牛刀的感觉。网站技术是为业务而存在的,除此毫...

小近
2014/11/03
2.8K
14
浅谈MVC、MVP、MVVM架构模式

在开发过程中,我们常常会针对一类问题而制定相关的处理方案,于是就有了相关的架构模式。目前主流的架构模式最主要就是MVC、MVP和MVVM这三种。 其实在不同的开发环境下,根据实际开发环境是...

安然若知
2018/06/04
0
0
Xss 跨站脚本测试平台--XssAPP

XssAPP 是一个专业的 XSS 渗透测试平台。 平台简介 用户在浏览网站、使用即时通讯软件、甚至在阅读电子邮件时,通常会点击其中的链接。攻击者通过在链接中插入恶意代码,就能够盗取用户信息。...

Coody
2017/02/07
1K
3
Spring MVC的controller层如何获取到请求的数据

版权声明:本文为博主原创文章,转载请注明出处,尊重劳动成果,谢谢~ https://blog.csdn.net/zhanglf02/article/details/78470375 javaweb应用开发,最常用到的就是应用之间的信息交互,调用...

徐风来
2018/11/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

nginx+tomcat配置https

1、nginx配置https和【proxy_set_header X-Forwarded-Proto $scheme;】 2、java代码: String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServe......

perofu
26分钟前
4
0
必看的Linux系统新手进阶老手心得

不知道从什么时候起,linux这个话题变得越来越普及,成为大家经常讨论的话题。无论在网络上还是实际生活中,竟然很多人都在纠结学习linux的问题。网络上给的答案千千万万,而却还有很多人踌躇...

Linux就该这么学
29分钟前
4
0
Spring Boot 配置元数据指南

1. 概览 在编写 Spring Boot 应用程序时,将配置属性映射到 Java bean 上是非常有用的。但是,记录这些属性的最好方法是什么呢? 在本教程中,我们将探讨 Spring Boot Configuration Proces...

liululee
32分钟前
3
0
foreach查找子类

$list = $menu_model -> menu_list();$parent_list = [];foreach ($list as $v){ if ($v['pid'] == 0) { $parent = $v; foreach ($list as $v1) ......

小小小壮
44分钟前
3
0
基于 HTML5 Canvas 实现的 TP-LINK 电信拓扑设备面板

前言 今天我们以真实的 TP-LINK 设备面板为模型,完成设备面板的搭建,和指示灯的闪烁和图元流动。 先来目睹下最终的实现效果:http://www.hightopo.com/demo/blog_tplink_20170511/index.h...

htdaydayup
50分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部