VUE - bigint解决前端精度丢失的问题

问题描述

java后端long类型的范围

-2^63~2^63，即：-9223372036854775808~9223372036854775807，它是19位的。
这个数字可以通过方法获得：Long.MAX_VALUE、Long_MIN_VALUE。

前端JS的数字类型的范围

-2^53~2^53，即：-9007199254740991~9007199254740991，它是16位的。
这个数字可以通过方法获得：Number.MAX_SAFE_INTEGER、Number.MIN_SAFE_INTEGER。

结论

可见，Java后端的Long宽度大于前端的。雪花算法一般会生成18位或者19位宽度的数字，那么这时就会出问题。

1. 安装插件

yarn add big-int 
yarn add json-bigint 
yarn add bignumber.js

2. 使用

var bigInt = require("big-int");

let senceId = bigInt(a.SenceIdString);

import BigNumber from 'bignumber.js';
let senceId= new BigNumber(10000000008214144);

axios接口调用返回值转换

import JSONBIG from "json-bigint";

export async function api_GetFilesWithAuth(authStr) {
    const res = await axios({
      url: `${assistURL}/api/TFiles/GetFilesWithAuthAsync`,
      methods: 'get',
      params: {
        authStr: authStr,
      },
      transformResponse: [
        function (data) {
          // 对 data 进行任意转换处理
          debugger;
          const jsonTruns = JSONBIG({
            // storeAsString: true,
          });
          return jsonTruns.parse(data);
        },
      ],

    });
    return res;
  }