这篇文章已经过时了。

请参考比较合适的前后端交互方式

首先是发送AJAX请求的html页面

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AJAX</title>
<script type="text/javascript" src="/lib/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
var saveData = {"en":"sss",
"ch":"げ啊爲",
"dt":"2012-01-02 03:04:05",
"no":"-3.1415926"}; function json_obj() {
$.ajax({
type:"post",
url:"/ajax/json_obj",
dataType:"json",
data:saveData,
success:function(data) {
alert(data);
},
error:function(data) {
alert('error');
}
});
} function json_str() {
$.ajax({
type:"post",
url:"/ajax/json_str",
dataType:"json",
contentType : 'application/json',
data:JSON.stringify(saveData),
success:function(data) {
alert(data);
},
error:function(data) {
alert('error');
}
});
}
</script>
</head>
<body>
<input id="a" value="b" type="hidden" />
<button onclick="json_obj()">json_obj</button><br><br>
<button onclick="json_str()">json_str</button><br><br>
</body>
</html>

然后是控制器和用于和参数绑定的实体类

/** 'package' and 'import' ingore */

@Controller
@RequestMapping("ajax")
public class AjaxController { private static final Logger log = LogManager.getLogger(AjaxController.class); @RequestMapping(value = "json_obj")
@ResponseBody
public String jsonobj(Data data) {
log.info("请求开始");
log.info("请求成功");
return "success";
} @RequestMapping(value = "json_str")
@ResponseBody
public String jsonstr(@RequestBody DataS data) {
log.info("请求开始");
log.info("请求成功");
return "success";
} } class Data { private String en;
private String ch;
@DateTimeFormat(pattern = "yyyy-MM-dd HH:mm:ss")
private Date dt;
private Double no; /** getter and setter ignore */ } class DataS { private String en;
private String ch;
private String dt;
private String no; /** getter and setter ignore */ }

以上的例子中,无论把json_obj和json_str的ajax.type改成get还是post,都是能成功运行得到正确结果的。

JS函数   <->   控制器的请求方法(实体类) 

json_obj   <->   jsonobj(Data)

这种情况下,ajax.data的内容是一个json对象,没有经过JSON.stringify()的转换。

尽量不要指定json_obj的ajax为contentType="application/json",否则,

对于get请求没关系,对于post请求,jsonobj(Data)的参数data无法得到绑定,会是null

jsonobj(Data)的参数前不能指定@RequestParam,

因为无论是post还是get请求,请求中都没有一个名为"data"的请求参数。

jsonobj(Data)的参数前不能指定@RequestBody,否则HTTP-400

发送一个json对象的好处是,实体类Data的域的类型可以指定为具体的类型,比如Double和Date。

其中Date域需要指定@DataTimeFormat(pattern="yyyy-MM-dd HH:mm:ss")

注解里的pattern最好跟ajax发送的日期一致,

如果pattern的信息比ajax少时,会丧失时间精度,

如果pattern的信息比ajax多是,Date域无法得到绑定,会是null

json_str   <->   jsonstr(DataS)

这种情况下,ajax.data的内容是一个json字符串,经过JSON.stringify()的转换。

ajax必须指定contentType : 'application/json',否则HTTP-415,

jsonobj(Data)的参数前必须指定@RequestBody,否则jsonobj(Data)的参数data无法得到绑定,会是null

发送一个json字符串的好处是,不需要进行类型转换了,实体类DataS的域都是String类型,

(这可能也是他的坏处,如果有需求的话,需要专门把String 转换成其他类型)

另一个好处是在数据验证方面,由于JSR303的@Pattern只支持String域,DataS的所有域都可以进行正则验证,保证了后续类型转化的安全性

向前端返回存在Date字段的数据的解决方法

处理Ajax请求的请求方法,几乎都会有@ResponseBody,请求的方法的返回值一般会有两种情况。

  • 返回一个String

这种情况,一般会做一步new ObjectMapper.writeValueAsString(resultEntity);的处理,

如果resultEntity里面有Date域,那直接用ObjectMapper转化的话,Date域会被转换成一串莫名其妙的数字,

为了避免这个现象,需要在ObjectMapper对象里注入一个转换器。

        ObjectMapper om = new ObjectMapper();
om.setDateFormat(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"));
String s = om.writeValueAsString(resultEntity); return s;
  • 返回一个实体类

这种情况,如果实体类都是String域,那肯定没问题,

如果实体类里有Date域,那么前端ajax.success函数里面直接data.dt会被转换成以串莫名其妙的数字,

这种情况下的,这个现象,后端是无法解决的。

以上两点中,出现“一串莫名其妙的数字”的情况,前端是有办法解决的。

    function timeStamp2String(time){
var datetime = new Date();
datetime.setTime(time);
var year = datetime.getFullYear();
var month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
var date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
var hour = datetime.getHours()< 10 ? "0" + datetime.getHours() : datetime.getHours();
var minute = datetime.getMinutes()< 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
var second = datetime.getSeconds()< 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
return year + "-" + month + "-" + date+" "+hour+":"+minute+":"+second;
}

简单来说就是在JS里面引入一个Date对象。

存在日期类型的JSON数据,进行SpringMVC参数绑定时存在的问题和解决方案的更多相关文章

  1. easyui框架Date日期类型以json形式显示到前台datagrid时,显示为[object Object]

    如下图,easyui当后台把时间数据返回转换成json然后加载在easyui的datagrid里面,显示为[object Object]      需要对时间格式添加格式的显示方法 /** * 时间格 ...

  2. 【转载】C#.NET WebApi返回各种类型(图片/json数据/字符串),.net图片转二进制流或byte

    C#.NET WebApi返回各种类型(图片/json数据/字符串),.net图片转二进制流或byte 转载:http://www.itdos.com/Mvc/20150302/0741255.htm ...

  3. 将String类型的json数据转换为真正的json数据

    问题 在做JavaWeb项目的时候,我们经常需要将Java对象转化为Json数据格式响应到前台页面,但是转化完成之后,看着是Json类型的数据格式,但实际上是字符串类型,在这里说两个方法将String ...

  4. ngResource提交json数据如何带参数

    ngResource提交json数据如何带参数 直接使用ngResource和REST服务接口交互可以让程序显得简洁,前提是配置好跨域和OPTIONS请求的支持,与此同时,如果需要带些额外的参数,有两 ...

  5. SpringMVC参数绑定总结

    springMvc作用:    a) 接收请求中的参数    b) 将处理好的数据返回给页面参数绑定(就是从请求中接收参数):    a) 默认支持的类型: request, response, se ...

  6. [转载]SpringBoot系列: SpringMVC 参数绑定注解解析

    本文转载自 https://www.cnblogs.com/morethink/p/8028664.html, 作者写得非常好, 致谢! SpringMVC 参数绑定注解解析   本文介绍了用于参数绑 ...

  7. SpringMVC参数绑定、Post乱码解决方法

    从客户端请求key/value数据,经过参数绑定,将key/value数据绑定到controller方法的形参上. springmvc中,接收页面提交的数据是通过方法形参来接收.而不是在control ...

  8. SpringMVC参数绑定(二)

    在springMVC中,提交请求的数据是通过方法形参来接收的,从客户端请求的key/value数据,经过参数绑定,将key/value数据绑定到controller形参上,然后再controller就 ...

  9. SpringMVC参数绑定(未完待续)

    1. Strut2与SpringMVC接收请求参数的区别 Struts2通过action类的成员变量接收SpringMVC通过controller方法的形参接收 2. SpringMVC参数绑定流程 ...

随机推荐

  1. 每次开机都要按F1的解决办法

    买了个新的硬盘来装电脑,装操作系统时到微软官网下载了WIN10放在U盘里制作成系统安装盘,具体操作自己百度.装好了之后发现每次开机都要按一下F1,百度了很多都没用, 一次偶然的机会,我拆开了电脑主机硬 ...

  2. Android获取设备唯一码

    String uuid = ""; String serial = null; String m_szDevIDShort = "35" + Build.BOA ...

  3. 【Spring】源码浅析 - ResponseEntity.ok 转载

    https://www.jianshu.com/p/1238bfb29ee1 ResponseEntity.ok具体源码

  4. LeetCode--字符串

    1.给定字符串s,分区s使得分区的每个子字符串都是回文. 返回s的所有可能的回文分区.例如,给定s =“aab”,返回 [ ["aa","b"], [" ...

  5. 315 · Istio1.1 功能预告,真的假不了

    Istio 1.0版本发布到现在,已经过去8个月.Istio1.1的候选版本也到了rc5,预计近期会正式发布1.1.此版本包含了许多错误修复,在流量管理,安全,策略和遥测,多集群等领域添加了新的功能. ...

  6. PAT Basic 1089 狼人杀-简单版 (20 分)

    以下文字摘自<灵机一动·好玩的数学>:“狼人杀”游戏分为狼人.好人两大阵营.在一局“狼人杀”游戏中,1 号玩家说:“2 号是狼人”,2 号玩家说:“3 号是好人”,3 号玩家说:“4 号是 ...

  7. 凌乱的yyy / 线段覆盖(贪心)

    https://www.luogu.org/problemnew/show/P1803  题目链接 贪心,选择结束时间为关键字排序,相同时开始时间大的在前,然后for一遍比较就好了 #include& ...

  8. Codeforces 348 D - Turtles

    D - Turtles 思路: LGV 定理 (Lindström–Gessel–Viennot lemma) 从{\(a_1\),\(a_2\),...,\(a_n\)} 到 {\(b_1\),\( ...

  9. 2018年6月2日-徐州ICPC邀请赛日志-收获第一枚icpc奖牌

    2018年徐州ICPC邀请赛日志 Z的预言成真了,在正式比赛的前一天他的说说是“last one”,没错正赛后就是铜牌区的最后一名.最后揭榜前的15分钟,我们三个如坐针毡,最后奇迹诞生了!       ...

  10. XSS攻击(出现的原因、预防措施)

    XSS攻击(出现的原因.预防措施......)   验证XSS攻击重点不是去查找可输入哪些内容会出现什么样的bug就是测试XSS攻击,重点是了解它出现的原理,为什么会出现XSS攻击,导致一些问题出现? ...