問題描述

針對比較大的數(shù)值類型，比如：1857260970794627073
前端js處理的時候，默認會將后面幾位數(shù)字變成0，變成了1857260970794627000，也就是丟失精度

處理方案

方案1：前端轉(zhuǎn)換

這是我網(wǎng)上找到的一種方案。使用json-bigint

npm install json-bigint@1.0.0

import axios from 'axios'
import jsonBig from 'json-bigint'
 

//利用axios對象的方法create,去創(chuàng)建一個axios實例
const api = axios.create({
    baseURL: "http:xxxxxxxxx", // 后端地址
    timeout: 60000, // 請求超時時間
    transformResponse: [function (data) {
        //transformResponse這個配置項可以攔截接口返回的內(nèi)容進行處理
        try {
            // 如果大數(shù)字類型轉(zhuǎn)換成功則返回轉(zhuǎn)換的數(shù)據(jù)結(jié)果
            return jsonBig.parse(data);
        } catch (err) {
            // 如果轉(zhuǎn)換失敗，代表沒有長數(shù)字可轉(zhuǎn)，正常解析并返回
            return JSON.parse(data)
        }
    }]
})
export default api

方案2：后端轉(zhuǎn)換

由于這個是通用問題，而且有多個后端服務(wù)，對應(yīng)不同的前端工程。
所以這個是我實際采用的方案

通過將Long類型的id字段序列化為String類型，保證前端能接收到完整的內(nèi)容

private static final ObjectMapper MAPPER = new ObjectMapper();
SimpleModule module = new SimpleModule();
module.addSerializer(Long.class, new JsonSerializer<>() {
    @Override
    public void serialize(Long value, JsonGenerator gen, SerializerProvider serializers) throws IOException {
        if (value!= null) {
            if("id".equals(gen.getOutputContext().getCurrentName())) {
                gen.writeString(String.valueOf(value));
            } else {
                gen.writeNumber(value);
            }
        }
    }
});
MAPPER.registerModule(module);

然后在配置類里，將ObjectMapper聲明為bean對象。解決問題