利用json-bigint处理后台数据大数字问题

json-bigint

GitHub网址：https://github.com/sidorares/json-bigint

当我们在写项目的时候调用后台接口的地址需要接收一个id值例如：（id：9223372036854776000）
JavaScript 能够准确表示的整数范围在-2^53到2^53之间（不含两个端点），超过这个范围，无法精确表示这个值，这使得 JavaScript 不适合进行科学和金融方面的精确计算
浏览器会默认解析得到数值与原数值不匹配导致404问题

解决这个问题我们使用第三方插件JSON-BigInt

1. 安装

npm i json-bigint

2. 导入

var JSONbig = require('json-bigint')

3. 使用

JSONbig.parse()

将json格式字符串转化为对象与JSON.parse()类似

var json = '{ "value" : 9223372036854775807}'
// 将json字符串转为对象
console.log(JSON.parse(json))// 9223372036854776000
console.log(JSONbig.parse(json).value.toString())// 是一个对象 需要toSring() 9223372036854776000

JSONbig.stringify()

将对象转化为json格式字符串与JSON.stringify()类似

// 将对象还原为json格式的字符串
console.log(JSON.stringify(JSONbig.parse(json))) // {"value":"9223372036854775807"}改变了原数据的值的数据类型
console.log(JSONbig.stringify(JSONbig.parse(json)))// {"value":9223372036854775807} 没有改变原数据

通过 Axios 请求得到的数据都是 Axios 处理（JSON.parse）之后的，我们应该在 Axios 执行处理之前手动使用 json-bigint 来解析处理。Axios 提供了自定义处理原始后端返回数据的 API：transformResponse 。

import axios from 'axios'
var jsonBig  = require('json-bigint')


const request = axios.create({
  baseURL: 'http://ttapi.research.itcast.cn/', // 接口基础路径

  // transformResponse 允许自定义原始的响应数据（字符串）
  transformResponse: [function (data) {
    try {
      // 如果转换成功则返回转换的数据结果
      return jsonBig.parse(data)
    } catch (err) {
      // 如果转换失败，则包装为统一数据格式并返回
      return {
        data
      }
    }
  }]
})

export default request