内容管理（八）01-删除-数字最大安全值 -axios默认转换格式JSON.parse() 改为 json-bigint格式JSONbig.parse(json) 处理json对象中的id值

最新推荐文章于 2024-08-12 14:44:05 发布

viceen

最新推荐文章于 2024-08-12 14:44:05 发布

阅读量4.5k

点赞数

CC 4.0 BY-SA版权

分类专栏：项目-vue-PC端 vue知识文章标签：大数据 vue json

本文链接：https://blog.csdn.net/weixin_44867717/article/details/104326988

vue知识同时被 2 个专栏收录

115 篇文章

订阅专栏

项目-vue-PC端

53 篇文章

订阅专栏

探讨JS数字最大安全值限制导致的数据处理问题，介绍如何使用json-bigint插件解决数字溢出，确保前后端数据一致。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

10-内容管理-删除-数字最大安全值

现象：后端给的值太大了，前端处理不了；获取到的数据值是不安全的

按F12检查——>点击Network 并刷新且看后端传给的数据，

点击左侧数据，①看右侧Response,显示数据格式为 json文本不能直接用，需要转化为json对象；

②看右侧Preview中 json对象

“id”: 1166528593157685248 在response中 json文本
id: 1166528593157685200 在preview中 json对象 (JSON.parse()转换)
在项目中是 axios 默认使用JSON.parse()转换，

同一id值转化过程中发生变化，不能直接使用

在这里插入图片描述

现象原因：后台返回的数字的值超出了js数字的最大安全值
- 最大值为：2的53次方（Number.MAX_SAFE_INTEGER 获取）
- JSON.parse() 有误差
- 数值运算有误差

在这里插入图片描述

处理问题：转换的时候改成其他的格式
- 使用 json-bigint 的js插件
  
  使用方法：axios中json-bigint处理json数据最大值无法准确获取
  网址：https://www.npmjs.com/package/json-bigint
- 安装 npm i json-bigint
- 导包 api/index.js var JSONbig = require('json-bigint')
- 使用：JSONbig.parse(json)
- 覆盖axios的转换方式，使用上面的方式。
```
transformResponse: [function (data) {
    // 对 data 进行任意转换处理
    return data;
}],
```

最终代码：api/index.js

import JSONBIG from 'json-bigint'
// 默认配置  转换响应数据
axios.defaults.transformResponse = [data => {
  // 对data（后台的原始数据）进行转换
  return JSONBIG.parse(data)
}]