如何解决前端传递数据给后端时精度丢失问题

解决精度丢失

有时候我们在进行修改操作时，发现修改既不报错也不生效。我们进行排查后发现服务器端将数据返回给前端时没有出错，但是前端js将数据进行处理时却出错了，因为id是Long类型的，而js在处理后端返回给前端的Long类型数据时只能处理前16位，后3位进行了四舍五入操作，例如后3位为225->200，所以前端的数据就出错了，在修改后发起请求时携带的数据就是错误的，所以修改并不生效。

解决方法

服务器给页面响应json数据时进行处理，将long类型的数据统一为String类型

解决步骤

对象转换器

• 提供对象转换器JacksonObjectMapper，基于Jackson进行Java对象到json数据的相互转换，同时将long类型转为String类型。addSerializer(Long.class, ToStringSerializer.instance)

package com.ldh.reggie.common;


/**
 * 对象映射器:基于jackson将Java对象转为json，或者将json转为Java对象
 * 将JSON解析为Java对象的过程称为 [从JSON反序列化Java对象]
 * 从Java对象生成JSON的过程称为 [序列化Java对象到JSON]
 */
public class JacksonObjectMapper extends ObjectMapper {

    public static final String DEFAULT_DATE_FORMAT = "yyyy-MM-dd";
    public static final String DEFAULT_DATE_TIME_FORMAT = "yyyy-MM-dd HH:mm:ss";
    public static final String DEFAULT_TIME_FORMAT = "HH:mm:ss";

    public JacksonObjectMapper() {
        super();
        //收到未知属性时不报异常
        this.configure(FAIL_ON_UNKNOWN_PROPERTIES, false);

        //反序列化时，属性不存在的兼容处理
        this.getDeserializationConfig().withoutFeatures(DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES);


        SimpleModule simpleModule = new SimpleModule()
                .addDeserializer(LocalDateTime.class, new LocalDateTimeDeserializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_TIME_FORMAT)))
                .addDeserializer(LocalDate.class, new LocalDateDeserializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_FORMAT)))
                .addDeserializer(LocalTime.class, new LocalTimeDeserializer(DateTimeFormatter.ofPattern(DEFAULT_TIME_FORMAT)))

                .addSerializer(BigInteger.class, ToStringSerializer.instance)
          //将Long类型的数据转为String类型
                .addSerializer(Long.class, ToStringSerializer.instance)
                .addSerializer(LocalDateTime.class, new LocalDateTimeSerializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_TIME_FORMAT)))
                .addSerializer(LocalDate.class, new LocalDateSerializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_FORMAT)))
                .addSerializer(LocalTime.class, new LocalTimeSerializer(DateTimeFormatter.ofPattern(DEFAULT_TIME_FORMAT)));

        //注册功能模块 例如，可以添加自定义序列化器和反序列化器
        this.registerModule(simpleModule);
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

消息转换器

• 在WebMvcConfig配置类中扩展Spring mvc的消息转换器，在此消息转换器中使用提供的对象转换器进行Java对象到json数据的转换，其中特别的是会将long类型数据转为String类型。不扩展配置则默认使用Spring mvc的消息转换器，它也会将Java对象与Json类型之间进行相互转换，这就是为什么我们在CRUD操作中返回return R.success(pageInfo),前端页面获取到的是JSON类型的数据。

package com.ldh.reggie.config;

@Slf4j
@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {

    //扩展mvc框架的消息转换器
    @Override
    protected void extendMessageConverters(List<HttpMessageConverter<?>> converters) {
        //创建消息转换器对象
        MappingJackson2HttpMessageConverter messageConverter = new MappingJackson2HttpMessageConverter();
        //设置对象转换器，底层使用Jackson将Java对象转为json
        messageConverter.setObjectMapper(new JacksonObjectMapper());
        //将上面的消息转换器对象追加到mvc框架的转换器集合中,index为转换器在集合中的顺序，最先才能生效
        converters.add(0,messageConverter);
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17