JS踩坑實(shí)戰(zhàn)之19位數(shù)Number型精度丟失問(wèn)題詳析
前言
這篇文章主要介紹了JS大坑之19位數(shù)的Number型精度丟失問(wèn)題,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,有興趣的朋友們可以一起來(lái)學(xué)習(xí)探討。
最近在實(shí)現(xiàn)一個(gè)需求的時(shí)候,需要接入第三方的接口,先調(diào)用A接口,A接口返回的數(shù)據(jù)里,有一個(gè)taskId,然后再使用這個(gè)taskId請(qǐng)求B接口,獲取最終需要的數(shù)據(jù)。
后端使用的是node,因此最開始使用的是request-promise這個(gè)包請(qǐng)求第三方接口,然而在獲取A接口返回的taskId之后,調(diào)用B接口之后,B接口的響應(yīng)居然是系統(tǒng)錯(cuò)誤!簡(jiǎn)易代碼如下:
const rp = require('request-promise') const { taskId } = await rp('https://xxx.com/A') const options = { method: 'POST', uri: 'https://xxx.com/B', body: { taskId }, json: true } const result = await rp(options) // { // "errorcode": "40001", // "message": "系統(tǒng)錯(cuò)誤", // "status": "failed" // }
接著我使用postman請(qǐng)求A接口,獲取新的taskId,再用新的taskId請(qǐng)求B接口,結(jié)果卻是正常的!
我在反復(fù)檢查代碼,確認(rèn)請(qǐng)求的參數(shù)都是正常的格式之后,一時(shí)陷入了無(wú)盡的沉思之中……
發(fā)現(xiàn)
在做了幾次嘗試之后,我發(fā)現(xiàn)使用node請(qǐng)求得到的taskId最后兩位數(shù)都是0,即1152921504735848700,而使用postman獲取的taskId,則是比較正常的是1152921504735848759,接著我在node控制臺(tái)做如下操作:
就是這么一瞬間,頓悟了。A接口里的taskId是個(gè)19位數(shù)字,而request-promise在將數(shù)據(jù)解析成json時(shí),導(dǎo)致這個(gè)19位的數(shù)字丟失了精度,查了下資料,發(fā)現(xiàn)js的number類型有個(gè)最大安全值,即2的53次方(9007199254740992),超過(guò)這個(gè)值就會(huì)出現(xiàn)精度丟失的問(wèn)題。
獲取正確的響應(yīng)數(shù)據(jù)
由于在一開始使用request-promise包,因此獲取的taskId是丟失了精度了,因此改用了node原生的http模塊發(fā)送請(qǐng)求。
const req = https.request('https://xxx.com/A', (res) => { res.on('data', (chunk) => { // 由于這里獲取到的響應(yīng)數(shù)據(jù)是JSON字符串,因此19位的數(shù)字只是字符串的一部分,這時(shí)獲取到的taskId就是正確的數(shù)字 console.log(`BODY: ${chunk}`); }); res.on('end', () => { console.log('No more data in response.'); }) })
雖然獲取到了正常的響應(yīng)數(shù)據(jù),但是這是個(gè)JSON字符串,接下來(lái)還要把這個(gè)字符串解析成JSON,但是用JSON.parse(),又會(huì)引起精度丟失的問(wèn)題,這可真尷尬 ……
如果這個(gè)接口是已方可控的,那么就可以把這個(gè)19位數(shù)的number轉(zhuǎn)成字符串,這樣在解析的時(shí)候就不會(huì)出錯(cuò)了,但是由于是第三方接口,因此沒(méi)法改變。那么最快的解決方案,就是換種編程語(yǔ)言請(qǐng)求啊。
最后的解決
好吧,最后還是用了node,不過(guò)我用了比較硬核的方案實(shí)現(xiàn),先在獲取的JSON字符串中,找到這個(gè)19位的數(shù)字,然后為它加上引號(hào),這樣再用JSON.parse()解析的時(shí)候,就能保持正常的數(shù)值,這樣接下的流程就自然通了,代碼如下:
let result = '{"taskId":1152921504735848759,"status":"CREATED","progress":0.0,"success":true}' // JSON.parse(result) 不為19位數(shù)補(bǔ)上雙引號(hào),直接parse時(shí),精度丟失,結(jié)果如下: // { // taskId: 1152921504735848700, // status: 'CREATED', // progress: 0, // success: true // } const taskId = result.match(/[0-9]{19}/)[0] // 正則獲取19位數(shù)字的值 result = result.replace(taskId,`"${taskId}"`) // 補(bǔ)上雙引號(hào) const data = JSON.parse(result) // { // taskId: '1152921504735848759', // 解析出來(lái)之后是字符串,因此沒(méi)有丟失精度 // status: 'CREATED', // progress: 0, // success: true // }
總結(jié)
到此這篇關(guān)于JS踩坑實(shí)戰(zhàn)之19位數(shù)Number型精度丟失問(wèn)題的文章就介紹到這了,更多相關(guān)JS Number型精度丟失問(wèn)題內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
純js實(shí)現(xiàn)html轉(zhuǎn)pdf的簡(jiǎn)單實(shí)例(推薦)
下面小編就為大家?guī)?lái)一篇純js實(shí)現(xiàn)html轉(zhuǎn)pdf的簡(jiǎn)單實(shí)例(推薦)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-02-02微信小程序動(dòng)態(tài)顯示項(xiàng)目倒計(jì)時(shí)
這篇文章主要為大家詳細(xì)介紹了微信小程序動(dòng)態(tài)顯示項(xiàng)目倒計(jì)時(shí),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-06-06js實(shí)現(xiàn)時(shí)間日期校驗(yàn)
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)時(shí)間日期校驗(yàn),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-05-05JavaScript的removeChild()函數(shù)用法詳解
removechild 函數(shù)可以刪除父元素的指定子元素,通過(guò)本文給大家介紹javascript的removeChild()函數(shù)用法,對(duì)js removechild函數(shù)相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2015-12-12JavaScript canvas實(shí)現(xiàn)跟隨鼠標(biāo)事件
這篇文章主要為大家詳細(xì)介紹了JavaScript canvas實(shí)現(xiàn)跟隨鼠標(biāo)事件,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-02-02JS實(shí)現(xiàn)跟隨鼠標(biāo)閃爍轉(zhuǎn)動(dòng)色塊的方法
這篇文章主要介紹了JS實(shí)現(xiàn)跟隨鼠標(biāo)閃爍轉(zhuǎn)動(dòng)色塊的方法,涉及javascript操作html元素及css樣式的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02