Express中Axios 1.2.0 GET请求返回不可读响应的问题求助

问题成因 #

你遇到的乱码是Axios 1.2.0的已知bug导致的：该版本对响应的自动解压逻辑存在缺陷，当服务器返回gzip/deflate压缩的响应时（比如JSONPlaceholder默认会返回压缩数据），Axios没有正确解压，直接把二进制压缩数据当成UTF-8字符串解析，最终输出乱码。

修复方案 #

方案1：升级Axios到修复版本 #

Axios在1.2.1版本已经修复了这个自动解压的问题，直接升级依赖即可解决：

# npm
npm update axios@^1.2.1

# yarn
yarn upgrade axios@^1.2.1

升级后不需要修改原有代码，result.data会正常解析为JSON数组。

方案2：手动处理解压（适合无法升级版本的场景） #

如果暂时不能升级Axios，可以手动指定响应类型为arraybuffer，然后用Node.js的zlib模块解压：

import axios from 'axios';
import zlib from 'zlib';
import { promisify } from 'util';

// 把zlib的回调方法转为Promise形式
const gunzip = promisify(zlib.gunzip);

const response = await axios.get('https://jsonplaceholder.typicode.com/posts', {
  responseType: 'arraybuffer',
  headers: {
    'Accept-Encoding': 'gzip, deflate'
  }
});

// 解压后转成UTF-8字符串再解析为JSON
const decompressedBuffer = await gunzip(response.data);
const result = JSON.parse(decompressedBuffer.toString('utf8'));

方案3：禁用服务器压缩 #

在请求头中指定不接受压缩响应，让服务器返回原始未压缩的数据：

const result: AxiosResponse = await axios.get('https://jsonplaceholder.typicode.com/posts', {
  headers: {
    'Accept-Encoding': 'identity'
  }
});

这种方法无需修改Axios版本，但会增加数据传输量，只适合临时应急使用。

内容的提问来源于stack exchange，提问作者Orkun