解決前后端交互數(shù)據(jù)出現(xiàn)精度丟失的多種方式
問題：
發(fā)送Ajax請(qǐng)求,請(qǐng)求后端接口創(chuàng)建訂單并且返回訂單號(hào)出現(xiàn)訂單號(hào)精度丟失的情況
情景復(fù)現(xiàn):
前端發(fā)送請(qǐng)求到后端接口
我們前端打印訂單號(hào)到控制臺(tái)查看,前端返回訂單號(hào):1510826214531666000
查看數(shù)據(jù)庫訂單號(hào):1510826214531665920
比較2個(gè)單號(hào)區(qū)別
可以明顯看出后面幾位數(shù)據(jù)丟失,這樣就存在一個(gè)問題,我前端通過該訂單號(hào)無法獲取到正確的訂單
數(shù)據(jù),就會(huì)出現(xiàn)訂單已經(jīng)保存成功但是查詢不到的問題
解決方式
問題出在前端的Long長度,沒有后端Long的長度長這樣,前端獲取到數(shù)據(jù)后會(huì)對(duì)數(shù)據(jù)進(jìn)行轉(zhuǎn)換,發(fā)現(xiàn)長度大于前端的Long最大長度就會(huì)精度丟失,那么我們應(yīng)該直接讓他返回字符串的數(shù)據(jù)不讓他轉(zhuǎn)換!
那么就會(huì)有2種解決方案
1.前端解決
請(qǐng)求的時(shí)候添加以下代碼,這樣前端接受就不會(huì)進(jìn)行轉(zhuǎn)化
{
transformResponse: [
function (data){
return data;
}
]
}
發(fā)送請(qǐng)求我們?cè)诳聪?打印返回的訂單查看
數(shù)據(jù)庫數(shù)據(jù)
可以看出沒有丟失精度
前端解決丟失完成
2.后端解決
我們更改后端實(shí)體類的值
通過@JsonFormat值把Long類型的值轉(zhuǎn)成String類型的值
@JsonFormat(shape =JsonFormat.Shape.STRING ) private Long orderId;// id
然后重啟后端代碼測(cè)試下,該接口由于后端返回的類型就是Long所以沒辦法使用這個(gè)方案
注意:
如果后端返回的是對(duì)象那么Id是Long類型的話可以通過@JsonFormat把對(duì)象的id從Long類型的轉(zhuǎn)換成String類型那么前端也不會(huì)出現(xiàn)精度丟失,如果單獨(dú)返回的數(shù)據(jù)類型一開始就是Long那么只能通過前端的方法解決
例如:
后端返回類型是Long那么只能改前端,不然就要更改后端返回為String,為了不影響后端業(yè)務(wù)盡可能使用前端的方式解決
以上就是解決前后端交互數(shù)據(jù)出現(xiàn)精度丟失的多種方式的詳細(xì)內(nèi)容，更多關(guān)于前后端數(shù)據(jù)交互精度丟失的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
解析dom中的children對(duì)象數(shù)組元素firstChild,lastChild的使用
以下是對(duì)dom中的children對(duì)象數(shù)組元素firstChild,lastChild的使用進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以參考下2013-07-07
小程序相信大家應(yīng)該都很熟悉了,對(duì)于小程序的整個(gè)運(yùn)營的方法,很多運(yùn)營都比較關(guān)注,今天希望通過一個(gè)思維導(dǎo)圖,這篇文章主要給大家介紹了關(guān)于小程序中如何繪制思維導(dǎo)圖的相關(guān)資料,需要的朋友可以參考下2021-10-10
javascript實(shí)時(shí)顯示當(dāng)天日期的方法
這篇文章主要介紹了javascript實(shí)時(shí)顯示當(dāng)天日期的方法,可實(shí)時(shí)顯示當(dāng)前日期及星期的功能,非常簡單實(shí)用,需要的朋友可以參考下2015-05-05
chrome下判斷點(diǎn)擊input上標(biāo)簽還是其余標(biāo)簽的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猚hrome下判斷點(diǎn)擊input上標(biāo)簽還是其余標(biāo)簽的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-09-09
將html頁面保存成圖片,圖片寫入pdf的實(shí)現(xiàn)方法(推薦)
下面小編就為大家?guī)硪黄獙tml頁面保存成圖片,圖片寫入pdf的實(shí)現(xiàn)方法(推薦)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-09-09
promise和co搭配生成器函數(shù)方式解決js代碼異步流程的比較
這篇文章主要介紹了promise和co搭配生成器函數(shù)方式解決js代碼異步流程的比較，在es6中引入的原生Promise為js的異步回調(diào)問題帶來了一個(gè)新的解決方式co模塊搭配Generator函數(shù)的同步寫法，更是將js的異步回調(diào)帶了更優(yōu)雅的寫法。感興趣的小伙伴們可以參考一下2018-05-05
JavaScript函數(shù)防抖與函數(shù)節(jié)流的定義及使用詳解
這篇文章主要為大家詳細(xì)介紹一下JavaScript中函數(shù)防抖與函數(shù)節(jié)流的定義及使用，文中的示例代碼講解詳細(xì)，對(duì)我們學(xué)習(xí)JS有一定幫助，需要的可以參考一下2022-08-08
JS解析json數(shù)據(jù)并將json字符串轉(zhuǎn)化為數(shù)組的實(shí)現(xiàn)方法
json數(shù)據(jù)在ajax實(shí)現(xiàn)異步交互時(shí)起到了很重要的作用，他可以返回請(qǐng)求的數(shù)據(jù)，然后利用客戶端的js進(jìn)行解析，這一點(diǎn)體現(xiàn)出js的強(qiáng)大，本文介紹JS解析json數(shù)據(jù)并將json字符串轉(zhuǎn)化為數(shù)組的實(shí)現(xiàn)方法，需要了解的朋友可以參考下2012-12-12
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)頂部導(dǎo)航特效，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-01-01
一個(gè)層慢慢增高展開,有種向下滑動(dòng)的效果...2006-11-11