nodejs+axios爬取html出现中文乱码并解决示例

下面是详细的攻略：

1. 前置知识

在讲解 nodejs+axios 爬取html出现中文乱码并解决示例之前，我们需要先了解以下术语和知识点：

• Node.js：一个基于Chrome V8引擎的JavaScript运行时，让JavaScript可以脱离浏览器运行，即在服务器端运行。
• Axios：一个基于Promise的HTTP客户端，用于浏览器和Node.js中发起HTTP请求。
• 编码方式（Encoding）：字符编码是一种将字符集中的字符编码为计算机可识别的表示的方式。在HTTP请求和响应中，采用的编码方式有多种，例如 UTF-8、GBK、ISO-8859-1 等。

2. 问题分析

在使用 nodejs+axios 爬取网页时，如果出现中文乱码，主要原因是网页在响应过程中采用了一种和机器默认编码方式不一致的编码方式，导致浏览器无法正常解析。因此解决中文乱码问题，关键点在于识别响应的编码方式，并将其转换为机器可识别的编码方式。

3. 解决方案

3.1 方案一：手动指定编码方式

由于 axios 默认采用 utf8 编码方式，因此我们可以尝试手动指定编码方式来解决中文乱码问题。假设响应的编码方式为 GBK，则可以按照以下方式进行编码处理：

const axios = require('axios');
const iconv = require('iconv-lite');

axios.get(url, {
  responseType: 'arraybuffer'
}).then(response => {
  const html = iconv.decode(Buffer.from(response.data), 'gbk');
  console.log(html);
}).catch(error => {
  console.log(error);
});

上述代码通过 iconv 模块来处理编码方式，首先将响应数据转换为 arraybuffer 类型，然后调用 iconv.decode() 方法将响应数据的 GBK 编码转换为 UTF-8 编码，最后输出转换后的 HTML 内容。

3.2 方案二：自动检测编码方式

如果不确定响应的编码方式，或者需要自动识别多种编码方式，可以使用第三方库 chardet 来自动检测编码方式并对响应内容进行解码。示例如下：

const axios = require('axios');
const chardet = require('chardet');
const iconv = require('iconv-lite');

axios.get(url, {
  responseType: 'arraybuffer'
}).then(response => {
  const encoding = chardet.detect(response.data);
  const html = iconv.decode(Buffer.from(response.data), encoding);
  console.log(html);
}).catch(error => {
  console.log(error);
});

上述代码中，chardet.detect() 方法会根据响应数据的内容自动推断响应的编码方式，并返回编码方式名称，然后使用 iconv.decode() 方法按照返回的编码方式对响应进行转换，最终输出转换后的 HTML 内容。

4. 示例说明

下面介绍两个实际应用场景，以帮助理解 nodejs+axios 爬取html出现中文乱码并解决的方法：

4.1 示例一：爬取豆瓣电影列表

const axios = require('axios');
const iconv = require('iconv-lite');

axios.get('https://movie.douban.com/top250', {
  responseType: 'arraybuffer'
}).then(response => {
  const html = iconv.decode(Buffer.from(response.data), 'utf8');
  console.log(html);
}).catch(error => {
  console.log(error);
});

上述示例中，我们通过 axios 发起 GET 请求，获取豆瓣电影 TOP250 的页面内容。响应消息使用 arraybuffer 类型处理，接着使用 iconv 对响应内容进行编码处理，并将处理后的 HTML 内容输出至控制台。

4.2 示例二：自动检测编码方式爬取新浪新闻

const axios = require('axios');
const chardet = require('chardet');
const iconv = require('iconv-lite');

axios.get('https://news.sina.com.cn/', {
  responseType: 'arraybuffer'
}).then(response => {
  const encoding = chardet.detect(response.data);
  const html = iconv.decode(Buffer.from(response.data), encoding);
  console.log(html);
}).catch(error => {
  console.log(error);
});

上述示例中，我们通过 axios 发起 GET 请求，获取新浪新闻的首页。同样使用 arraybuffer 处理响应消息，然而此处并未手动指定编码方式，而是通过第三方库 chardet 自动检测编码方式，并使用 iconv 按照返回的编码方式对响应进行转换处理。最终将转换后的 HTML 内容输出至控制台。