SpringBoot解决前端js处理大数字丢失精度问题Long转String

一、Jackson对Long类型的处理导致精度丢失的问题

表的某一个字段的类型是 BIGINT,对应的 Java 类的属性的类型就是 Long。当这个字段的值由后端返回给前端网页时,发现了精度丢失的问题。比如后端返回的值是 588085469986509185,到了前端是 588085469986509200,后面的几位数变成了 0,精度丢失了

二、原因

JavaScript 中数字的精度是有限的,BIGINT 类型的的数字超出了 JavaScript 的处理范围。JavaScript 遵循 IEEE 754 规范,采用双精度存储(double precision),占用 64 bit,各位的含义如下:

1位(s) 用来表示符号位

11位(e) 用来表示指数

52位(f) 表示尾数

尾数位最大是 52 位,因此 JS 中能精准表示的最大整数是 Math.pow(2, 53),十进制即 9007199254740992。而 BIGINT 类型的有效位数是63位(扣除一位符号位),其最大值为:Math.pow(2, 63)。任何大于 9007199254740992 的就可能会丢失精度

三、解决方法

解决办法就是让 JavaScript 把数字当成字符串进行处理。对 JavaScript 来说,不进行运算,数字和 字符串处理起来没有什么区别,在 Springboot 中处理方法基本上有以下几种:

3.1 配置参数 write_numbers_as_strings

Jackson 有个配置参数 WRITE_NUMBERS_AS_STRINGS,可以强制将所有数字全部转成字符串输出。其功能介绍为:Feature that forces all Java numbers to be written as JSON strings.

使用方法很简单,只需要配置参数即可

XML 复制代码
spring:
  jackson:
    generator:
      write_numbers_as_strings: true

这种方式的优点是使用方便,不需要调整代码;缺点是颗粒度太大,所有的数字都被转成字符串输出了,包括按照 timestamp 格式输出的时间也是如此

3.2 给 Java 类的属性单独加注解

java 复制代码
@JsonSerialize(using=ToStringSerializer.class)
   private Long userId;

指定了 ToStringSerializer 进行序列化,将数字编码成字符串格式。这种方式的优点是颗粒度可以很精细;缺点同样是太精细,如果需要调整的字段比较多会比较麻烦

3.3 自定义ObjectMapper

最后想到可以单独根据类型进行设置,只对 Long 型数据进行处理,转换成字符串,

而对其他类型的数字不做处理。Jackson 提供了这种支持。方法是对 ObjectMapper 进行定制。根据 SpringBoot 的官方文档,找到一种相对简单的方法,只对 ObjectMapper 进行定制,而不是完全从头定制,方法如下:

java 复制代码
import com.fasterxml.jackson.databind.ser.std.ToStringSerializer;
import org.springframework.boot.autoconfigure.jackson.Jackson2ObjectMapperBuilderCustomizer;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;

@Configuration
public class JacksonConfig {

    @Bean
    public Jackson2ObjectMapperBuilderCustomizer jackson2ObjectMapperBuilderCustomizer() {
        return jacksonObjectMapperBuilder -> {
            // long -> String
            jacksonObjectMapperBuilder.serializerByType(Long.TYPE, ToStringSerializer.instance);
            // Long -> String
            jacksonObjectMapperBuilder.serializerByType(Long.class, ToStringSerializer.instance);
        };
    }
}

如果是 Json 工具类,可以这么设置

java 复制代码
import com.fasterxml.jackson.databind.ObjectMapper;
import com.fasterxml.jackson.databind.module.SimpleModule;
import com.fasterxml.jackson.databind.ser.std.ToStringSerializer;

public class JsonUtil {

    private static ObjectMapper mapper = new ObjectMapper();

    static {
        SimpleModule simpleModule = new SimpleModule();
        // long -> String
        simpleModule.addSerializer(Long.TYPE, ToStringSerializer.instance);
        // Long -> String
        simpleModule.addSerializer(Long.class, ToStringSerializer.instance);
        mapper.registerModule(simpleModule);
    }    
}

四、补充

如果方法3配置JacksonConfig不起作用但方法2起作用,请检查是否配置了MVC,MVC级别比配置JacksonConfig要高,请在WebMvcConfig里配置Long转换String

java 复制代码
@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {
    /**
     * 配置转换器
     * @return
     */
    public MappingJackson2HttpMessageConverter mappingJackson2HttpMessageConverter() {
        MappingJackson2HttpMessageConverter converter = new MappingJackson2HttpMessageConverter();
        converter.setObjectMapper(getObjectMapper());
        return converter;
    }

    private ObjectMapper getObjectMapper() {
        ObjectMapper objectMapper = new ObjectMapper();

        // 指定时区
        objectMapper.setTimeZone(TimeZone.getTimeZone("GMT+8:00"));
        // 日期类型字符串处理
        objectMapper.setDateFormat(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"));

        // Java8日期处理
        JavaTimeModule javaTimeModule = new JavaTimeModule();
        javaTimeModule.addSerializer(LocalDateTime.class, new LocalDateTimeSerializer(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss")));
        javaTimeModule.addSerializer(LocalDate.class, new LocalDateSerializer(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss")));
        javaTimeModule.addSerializer(LocalTime.class, new LocalTimeSerializer(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss")));
        javaTimeModule.addDeserializer(LocalDateTime.class, new LocalDateTimeDeserializer(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss")));
        javaTimeModule.addDeserializer(LocalDate.class, new LocalDateDeserializer(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss")));
        javaTimeModule.addDeserializer(LocalTime.class, new LocalTimeDeserializer(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss")));
        objectMapper.registerModule(javaTimeModule);

        //将Long序列成String
        SimpleModule simpleModule = new SimpleModule();
        simpleModule.addSerializer(Long.class, ToStringSerializer.instance);
        simpleModule.addSerializer(Long.TYPE, ToStringSerializer.instance);
        objectMapper.registerModule(simpleModule);
        return objectMapper;
    }
}
相关推荐
come112346 分钟前
Vue 响应式数据传递:ref、reactive 与 Provide/Inject 完全指南
前端·javascript·vue.js
前端风云志28 分钟前
TypeScript结构化类型初探
javascript
musk121244 分钟前
electron 打包太大 试试 tauri , tauri 安装打包demo
前端·electron·tauri
考虑考虑1 小时前
Springboot3.4.x中的@Bean使用
spring boot·后端·spring
翻滚吧键盘1 小时前
js代码09
开发语言·javascript·ecmascript
万少2 小时前
第五款 HarmonyOS 上架作品 奇趣故事匣 来了
前端·harmonyos·客户端
OpenGL2 小时前
Android targetSdkVersion升级至35(Android15)相关问题
前端
rzl022 小时前
java web5(黑马)
java·开发语言·前端
Amy.Wang2 小时前
前端如何实现电子签名
前端·javascript·html5
海天胜景2 小时前
vue3 el-table 行筛选 设置为单选
javascript·vue.js·elementui