vue前端解决long类型精度丢失问题（雪花ID）

起因

起因是后端ID查询始终为空，经排查发现前端请求携带的id参数精度丢失，类似于四舍五入。

解决方案

前端

使用json-bigint库，专门处理大整数 JSON 解析的库，会自动将超出安全范围的数字转为 BigInt，避免精度丢失。

安装依赖

npm install json-bigint # 或者使用yarn yarn add json-bigint

使用方法

import axios from 'axios'; import JSONBig from 'json-bigint'; // 创建自定义解析器 const jsonParser = JSONBig({ storeAsString: false, // false：转为BigInt；true：转为字符串 }); // 配置axios const myAxios = axios.create({ baseURL: '/api', // 重写响应数据的解析方式 transformResponse: [function (data) { try { // 用json-bigint解析数据 return jsonParser.parse(data); } catch (e) { // 解析失败时用默认方式 return JSON.parse(data); } }] }); export default myAxios;

后端

方法一：将ID字段设置为String，从而避免长整型的精度丢失

方法二：如果实体类非要使用long类型的话，可以在响应封装类和请求封装类中将id转换为字符串类型