码迷,mamicode.com
首页 > Web开发 > 详细

关于Ajax接收 后台返回的 Long类型数据的处理思路

时间:2020-09-17 18:14:11      阅读:44      评论:0      收藏:0      [点我收藏+]

标签:fastjson   long   sage   vcc   类型   remes   ack   调试   object   

场景重现:

最近在开发 狐小E智慧办公 项目时,写ajax时遇到一个小坑,之前都是做后端开发,对前端js代码没有深入了解,只是会使用相关函数,当开发某个功能时,列表已经开发完成,点击列表跳转详情时老是报找不到数据错误,调试后发现每次后端返回的列表里有id,而查详情时,也是带着id,但是在数据库却无法查到。最终仔细对比发现后端返回列表的id和ajax里接收的id不一致。id返回到前端后已经不是正确的值了。发现只要后端返回的是long 类型的值 就会一定机率出现前端的值与后端接收的不一致的情况。

问题产生原因:

JS内置有32位整数,而number类型的安全整数是53位。如果超过53位,则精度会丢失。也就是后端直接返回的Long类型数据超过53位,则前端接收时就会丢失精度。

解决方案:

① 修改对应后端的类,返回的VO对象Long类型字段转换为String类型,或者新定义一个String类型的字段将原始的Long类型值 toString()后存入即可。这样改的缺点就是需要改动的代码较多,不推荐。
② 通过全局控制添加转换器 通过fastJson的转换 或者jackson 来实现全局将long类型转为String.

例如:SpringBoot默认使用jackson ,则只需要增加转换器即可 代码如下`


@EnableWebMvc
@Configuration
public class WebJsonConverterConfig extends WebMvcConfigurerAdapter {
    public void configureMessageConverters(List<HttpMessageConverter<?>> converters) {
        MappingJackson2HttpMessageConverter jackson2HttpMessageConverter = new MappingJackson2HttpMessageConverter();
        ObjectMapper objectMapper = new ObjectMapper();

        SimpleModule simpleModule = new SimpleModule();
        simpleModule.addSerializer(Long.TYPE, ToStringSerializer.instance);
        simpleModule.addSerializer(Long.class, ToStringSerializer.instance);

        objectMapper.registerModule(simpleModule);
        jackson2HttpMessageConverter.setObjectMapper(objectMapper);
        converters.add(jackson2HttpMessageConverter);
    }
}

这样通过全局控制使代码修改量最小,并且对所有Long类型字段都可以起到转换。

③ 若Long类型数据的生成不是通过数据库生成,而是在代码逻辑中调用工具类或者id生成器服务生成Long类型数据,那可以在根源上调整Long类型数据生成策略,使其保持在53位之内,那直接返回Long类型数据也不会丢失精度。

我们开发 狐小E智慧办公 时,正好所有的Long类型数据都是调用一个统一的生成Long类型数据的服务,这样我们评估了业务需要的Long类型数据在53位之内也不会重复,所以改动了这个服务,使产生的Long类型数据的范围都在53位之内,这样前端就不会出现丢失精度问题了。但是需要根据业务判断 限制Long类型长度是否会影响业务。

最终解决ajax丢失精度的问题返回String 或者 在精度范围内返回long 只要结果是正确的即可。

在参与开发 狐小E智慧办公项目中,就是这样一点点的经验慢慢的积累起来,希望每天能看到自己的进步。

关于Ajax接收 后台返回的 Long类型数据的处理思路

标签:fastjson   long   sage   vcc   类型   remes   ack   调试   object   

原文地址:https://blog.51cto.com/14905509/2529780

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!