解决axios返回string类型数据后精度丢失的问题

问题描述

使用axios发起请求,返回数据为长串数字的字符串。
在回调函数中获取时,数据类型为number,且有精度丢失

问题截图

axios源码 - transformResponse

// 得到响应后，将请求到的数据转换为JSON对象
// /lib/defaults.js
transformResponse: [function transformResponse(data) {
    if (typeof data === 'string') {
      try {
        data = JSON.parse(data);
      } catch (e) { /* Ignore */ }
    }
    return data;
}]

在接收到请求的数据后,axios会将string类型的数据进行JSON.parse的转换

解决方案

1. 全局设置

axios.defaults.transformResponse = [(data, headers)=> {
    /*eslint no-param-reassign:0*/
    if (typeof data === 'string' && headers["content-type"] === "application/json") {
      data = data.replace(PROTECTION_PREFIX, '');
      try {
        data = JSON.parse(data);
      } catch (e) { /* Ignore */ }
    }
    return data;
  }]

2. 在请求config中设置

axios.post(url, data, {
    ...otherConfig,
    transformResponse: (data: any, headers: any) => {
      if (typeof data === 'string' && headers["content-type"] === "application/json") {
        try {
          // tslint:disable-next-line:no-parameter-reassignment
          data = JSON.parse(data);
        } catch (e) { /* Ignore */ }
      }
      return data;
    }
})

Point: 设置transformResponse,在contentType为json时才进行parse解析