首先,后端返回的数据一般是JSON格式的字符串,
而axios 会默认自动把后端返回的JSON格式的字符串使用JSON.parse()转换为JS对象,但是由于JS的安全整数范围为
因此,如果后端返回的数据中有超过这个范围的数字(如用户的ID),则这种默认的转换方式将会出错,转换过来的数据将会不准确。
此时的解决方案:
采用第三方包json-bigint,这个包中的parse方法将可以解决这个问题。
原理:
使用parse()方法后,json-bigint 会把超出 JS 安全整数范围的数字转为一个 BigNumber 类型的对象(这个对象是它内部的一个算法处理之后的),我们要做的就是把这个对象转为字符串:BigNumber.toString() ,这样就能得到原来正确的数据了。
解决思路:
不要让 axios 使用 JSON.parse 来转换这个数据,而是使用 json-bigint 来做转换处理。即我们需要得到后端给我们返回的不经转化的、最原始的数据,而axios刚好提供给我们一个API:transformResponse,专门用来定制后端返回的原始数据的处理(此函数中的参数data就是原始数据)。
使用步骤:
1、安装:npm install json-bigint
2、导入:import JSONbig from ‘json-bigint’
3、使用:在 request.js 请求模块中添加以下处理代码:
之所以要使用try…catch,是因为后端返回的数据有可能不是JSON格式的字符串,如果要转换的数据格式不是字符串的话,程序将会报错,所以需要捕获异常,在异常处理的代码块中把原始数据返回。
我们说这个JSONbig是用来处理大数字的,但是没超过整数范围的json数据它也是能正常转换的。因此,在上面的代码块中我没有直接把toString写上去,只有当返回的数据超出了安全整数范围,然后经过transformResponse转换为BigNumber时,才需要写上tostring。