不知道为什么,前端显示的所有数据项都没有错,就只有时间那一项很奇怪,是一串数字,而且这个数字在数据库怎么都找不到……

然后我在后端从service到controller都debug了一遍,发现数据都没有错,拿的都是时间啊。

后来百度知道,原来后台在返回json数据的时候,用自身的序列化机制会把时间变成一段很长的数字,就像上面的显示一样。

然后这里就要用到一个东西:

@JsonFormat,它的作用是,出参时,自动把Date型对象数据转化成正确的格式化后的字符串出去

效果:

然后又通过度娘知道,还有个注解

@DateTimeFormat

这个是用于将前台传到后台字符串变量转换为Date类型。请求报文只需要传入yyyymmddhhmmss字符串进来,则自动转换为Date类型数据。(不过好像前端要传的是json)

这里也有个小例子:

前端只传了一个 格式正确的  时间字符串

layer.open({
type : 2,
title : '归档详情',
//btn: ['选中', '取消'],
shade : false,
area : [ '900px', '600px' ],
maxmin : true,
content : gateUrl.UiUrl + '/productbaseEdition?eTime='
+ edition.table.bootstrapTable('getSelections')[0].eTime,// 这里content是一个URL,如果你不想让iframe出现滚动条,你还可以content:['http://sentsin.com', 'no']
end : function() { }
});

这里就只是在请求url那里拼接了一个  eTime上去。

然后后台一开始直接用Date接,毫无疑问,无法成功,然后就用了这个@DateTimeFormat

看后端代码:

@Controller
@RequestMapping("")
public class ProductbaseEditionController extends BaseController { @GetMapping("/productbaseEdition")
public String productbaseEdition(@DateTimeFormat(pattern="yyyy-MM-dd HH:mm:ss")Date eTime) {
System.out.println("#################test time:"+eTime);
return "productbaseEdition/list";
}
}

接收成功!(这里不是json数据,然后用注解@JsonFormat似乎不能成功接收)

不过也有资料说,@JsonFormat不仅可以完成后台到前台参数传递的类型转换,还可以实现前台到后台类型转换。当content-type为application/json时,优先使用@JsonFormat的pattern进行类型转换。而不会使用@DateTimeFormat进行类型转换。

然后我也根据这个做了几个实验,

@JsonFormat(pattern="yyyy-MM-dd HH:mm:ss",timezone = "GMT+8")
//@DateTimeFormat(pattern="yyyy-MM-dd HH:mm:ss")
private Date eTime;//归档时间,也是归档的版本号

这是实体里面的一个属性,前端传用json传数据过来,然后Controller用这个实体来接收

                 var data = {};
data.id = edition.currentItem.id;
data.eTime = edition.currentItem.eTime;
layer.confirm('确定删除这个归档版本吗?', null, function (index) { $.ajax({
url: edition.baseUrl + "/editionDelete",
type: "POST",
data:JSON.stringify(data),
headers : {
'Content-Type' : 'application/json;charset=utf-8'
},
success: function (data) {
console.log(data);
if (data.code == '0') {
layerTips.msg("删除成功!");
edition.refresh();
} else {
layerTips.msg("删除失败!") }
}
});
layer.close(index);
});

结论是:

1.前端如果传来的是json数据,时间格式是正确的,那么@JsonFormat是可以正确将其转换成Date类型的。

2.前端如果传来的是json数据,时间格式是正确的,那么@DateTimeFormat是可以正确将其转换成Date类型的。

3.但是,用json出参时用注解@DateTimeFormat似乎行不通,就是前面的问题,json返回Date对象时,java的序列化会把date变成一串数字,然后@dataTimeFormat似乎无法解决这个问题。

结论:

1.如果前后端传的数据都是json,那么后台接数据,传数据都可以用@JsonFormat。

2.@DateTimeFormat适合后端  接收   前端传来的数据,不管是不是json都可以正确转换成Date型数据,只要前端传来的格式正确且后端@DateTimeFormat的pattern写正确了,但是这个注解无法将Date型数据用json传到后端去。

关于JavaDate数据返回到前端变数字的问题(并引申到前后端时间的传输)的更多相关文章

  1. 导出excel,并将数据返回给前端(包含权限判断)

    一.先写导出按钮接口 1.此接口对用户权限进行判断 2.此接口将前端的参数组合拼凑到下一个接口的url中去,用于条件筛选 3.用户有权限的情况下将用户的权限信息保存到redis中去,并将token写到 ...

  2. 循序渐进VUE+Element 前端应用开发(23)--- 基于ABP实现前后端的附件上传,图片或者附件展示管理

    在我们一般系统中,往往都会涉及到附件的处理,有时候附件是图片文件,有时候是Excel.Word等文件,一般也就是可以分为图片附件和其他附件了,图片附件可以进行裁剪管理.多个图片上传管理,及图片预览操作 ...

  3. 后台对象转化成json数据返回给前端

    一.介绍 JSON-lib包是一个beans,collections,maps,java arrays 和XML和JSON互相转换的包,主要就是用来解析Json数据 二.下载jar依赖包:可以去这里下 ...

  4. MVC使用Newtonsoft无需实体类,实现JSON数据返回给前端页面使用

    //引用using Newtonsoft.Json; using Newtonsoft.Json.Linq; public ActionResult JsonSample() { ResponseRe ...

  5. python后端从数据库请求数据给到前端的具体实现

    先来贴一窜代码让大家理解前端/后端/数据库的工作原理, 首先简要说明:前端向后端请求数据,后端根据前端请求数据的类别分析其需求,并连接到数据库获取相应数据: 来一段简单的实例代码模拟淘宝商城: 前端代 ...

  6. web前后端数据交互

    前后端数据交互是每一名web程序员必须熟悉的过程,前后端的数据交互重点在于前端是如何获取后端返回的数据,毕竟后端一般情况下只需要将数据封装到一个jsonMap,然后return就完了.下面通过一个li ...

  7. Spring Security 前后端分离登录,非法请求直接返回 JSON

    hello 各位小伙伴,国庆节终于过完啦,松哥也回来啦,今天开始咱们继续发干货! 关于 Spring Security,松哥之前发过多篇文章和大家聊聊这个安全框架的使用: 手把手带你入门 Spring ...

  8. 基于Ajax技术的前后端Json数据交互方式实现

    前言 使用浏览器访问网站是日常生活中必不可少的一件事情,当我们在浏览器地址栏中输入网址后会看到网站的内容,那么这个过程中发生了什么?下面简单介绍下浏览器访问网站过程. 第一步:浏览器向DNS服务器发起 ...

  9. 把数据转化为JSON格式用ajax进行前后端交互

    接着在https://www.cnblogs.com/dong973711/p/10907733.html的基础上做验证. 从前端提交数据 前端页面,submit.html <!DOCTYPE ...

随机推荐

  1. 通过Chrome浏览器进行android调试/Remote Debugging on Android with Chrome

    The way your web content behaves on mobile can be dramatically different from the desktop experience ...

  2. hdu-4857 逃生(拓扑序)

    题目链接: 逃生 Time Limit: 2000/1000 MS (Java/Others)     Memory Limit: 32768/32768 K (Java/Others) Proble ...

  3. Linux命令学习笔记- vmstat命令实战详解

    vmstat命令是最常见的Linux/Unix监控工具,可以展现给定时间间隔的服务器的状态值,包括服务器的CPU使用率,内存使用,虚拟内存交换情况,IO读写情况.这个命令是我查看Linux/Unix最 ...

  4. HDU2444(二分图判定+最大匹配)

    The Accomodation of Students Time Limit: 5000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K ( ...

  5. 普通用户Mysql 5.6.13 主从,主主及nagios的mysql slave监控

    Master:192.168.209.19 Slave:192.168.209.20 mysql版本:mysql5.6.13 1. 以root身份创建普通用户,如mysql,并创建mysql安装目录: ...

  6. Linux设备驱动之Kobject、Kset

    作者:lizuobin(也是我们兼职的论坛答疑助手) 原文: https://blog.csdn.net/lizuobin2/article/details/51523693 纠结又纠结,虽然看了一些 ...

  7. 【重磅推荐】嵌入式Linux经典书单(部分含视频)

    一直都有人问我要书单,在网上搜索大半天,没找到合适的,他们写的太不负责了,遂决定自己整理. 本书单综合了豆瓣知乎热评,尤其参考了一线开发者韦东山学员群的小伙伴们的意见, 再结合本人多年答疑经验整理而成 ...

  8. html锚点实现的方法

    1 通过id <a href="#div1"> 通过id获取锚点</a> <div style=" height:200px; width: ...

  9. Laravel中的路由管理

    //路由中输出视图Route::get('/', function () { return view('welcome');}); //get路由请求Route::get('get',function ...

  10. 201621123016《Java程序设计》第二周学习总结

    1. 本周学习总结 1.本周学习重点: 字符串常量池:这是java中为减少字符串的建立而设计的,在没有使用new构建字符串时,jvm会从字符串常量池查找其值,如果没有则会创建这个字符串再把其放在字符串 ...