相关文章推荐
飞奔的绿茶  ·  招用高校毕业生可享扩岗补助 ...·  3 月前    · 
激动的瀑布  ·  斗破苍穹漫画美杜莎之辱图片 ...·  11 月前    · 
睡不着的地瓜  ·  “丁真背后的男人”杜冬正式卸任:不认为自己是 ...·  11 月前    · 
耍酷的移动电源  ·  江苏常州:古运河畔“红色唱段”“传统戏剧”你 ...·  12 月前    · 
爱热闹的奔马  ·  Wifi Policy CSP - ...·  1 年前    · 
Code  ›  JSON.parse 导致大数精度丢失问题的解决方案开发者社区
解决方案
https://cloud.tencent.com/developer/article/1625232
不要命的汉堡包
2 年前
作者头像
用户1437675
0 篇文章

JSON.parse 导致大数精度丢失问题的解决方案

前往专栏
腾讯云
备案 控制台
开发者社区
学习
实践
活动
专区
工具
TVP
文章/答案/技术大牛
写文章
社区首页 > 专栏 > Angular&服务 > 正文

JSON.parse 导致大数精度丢失问题的解决方案

发布 于 2020-05-08 16:45:54
3K 0
举报

问题

前端向服务端请求某个订单数据,其中订单号 18 位,在 数据库 中以数字的形式保存,服务端查询数据库后向前端返回如下数据:

{
    code: 0,
    message: 'success',
    data: {
        uid: 10001,
        productId: 100003,
        orderId: 179828993786548789
}

前端调用接口后,通过 http 传输的数据并不是 JSON,而是 JSON 字符串:

"{"code":0,"message":"success","data":{"uid":10001,"productId":100003,"orde
rId":179828993786548789}}"

由于在各大 HTTP 请求库的内部,实现了对application/json 等各种类型返回数据的格式化,也就是调用JSON.parse来对请求过来的数据进行处理,因此,前端通过这些调用获取到的数据已经是被格式化了,得到了如下数据:

{
    code: 0,
    message: 'success',
    data: {
        uid: 10001,
        productId: 100003,
        orderId: 179828993786548800
}

很明显可以看到,orderId变化了,这是因为js的number类型有个最大值(安全值)。即2的53次方减1,为9007199254740991。如果超过这个值,那么js会出现不精确的问题。这个值为16位。

解决方法

其实最简单的解决方案,也是大家一下子就能想到的,就是让服务端把订单号以字符串的形式返回回来。这是最简单最便捷的解决方式。

我们这里仅针对这个问题来解决问题,从自身出发寻找解决方案。

无论是 fetch 还是 axios 等各种 HTTP 库,都提供了类似于 formatResponseData 的方法,可以自己传入格式化的方法而不是使用默认的 JSON.parse 。问题的解决入口就在于此。

方案一(不推荐)

在 formatResponseData 中,找到对应的字段,并将其值改为字符串,再使用 JSON.parse 方法来格式化。

为什么不推荐呢?不通用,仅针对当前业务解决问题。

方案二 (推荐)

使用 json-bigint 处理返回值。

json-bigint 提供了几个示例,为了彻底解决,将大数转换为字符串是比较保险的方案,因此推荐下面这个方案:

执行内容:

var JSONbigString = require('json-bigint')({"storeAsString": true});
 
推荐文章
飞奔的绿茶  ·  招用高校毕业生可享扩岗补助 按每人1500元标准直接补贴到用人单位_政策解读_首都之窗_北京市人民政府门户网站
3 月前
激动的瀑布  ·  斗破苍穹漫画美杜莎之辱图片 美杜莎之辱出来了吗_九游手机游戏
11 月前
睡不着的地瓜  ·  “丁真背后的男人”杜冬正式卸任:不认为自己是丁真的导师_直击现场_澎湃新闻-The Paper
11 月前
耍酷的移动电源  ·  江苏常州:古运河畔“红色唱段”“传统戏剧”你方唱罢我登场
12 月前
爱热闹的奔马  ·  Wifi Policy CSP - Windows Client Management | Microsoft Learn
1 年前
今天看啥   ·   Py中国   ·   codingpro   ·   小百科   ·   link之家   ·   卧龙AI搜索
删除内容请联系邮箱 2879853325@qq.com
Code - 代码工具平台
© 2024 ~ 沪ICP备11025650号