【1】执行Http请求访问网页

【1】执行Http请求访问网页

1. 目标网址

我们的目标网址是当当网，url地址是 http://book.dangdang.com/

2. 获取HTML文档内容

目的是获取当当网的HTML文档内容，我们借助axios这个库发起HTTP的GET请求。

安装库： npm install axios

• 源代码

//axios是用于发起HTTP请求的库
const axios = require('axios');

// 要访问的目标网址
const targetUrl = "http://book.dangdang.com/";

axios.get(targetUrl)
    .then(function (response) {
        //get请求的响应结果是一个object，我们所需的HTML文档内容是该对象的data属性
        console.log(response.data)
    })
    .catch(function (error) {
        console.log(error);
    });

• 运行结果
  

3. 原因分析与解决思路

3.1 原因分析

从运行结果可以看出，成功抓取了HTML文档的内容。但是存在中文乱码的情况，这种情况一般是编码不一致问题。axios编码默认是 utf8 ，那么我们只需要确定当当网的编码即可。

使用Chrome浏览器打开当当网，在Network中任意选中一条请求资源，可以查看到响应的头信息。如下响应头信息中编码为 GBK 。中文乱码就确认了是编码不一致的原因。

3.2 解决思路

既然两者编码不一致，那么解决思路就是改变其中一方的编码。由于axios不支持 gbk ，所以我们让另一方改变，也就是网页响应结果的编码转成 utf8 。

1. 设置请求的响应结果以流方式返回，需要设置 responseType 。
2. 借助iconv-lite这个库进行编码转换。

安装库： iconv-lite

• 源代码

// http://book.dangdang.com/
const axios = require('axios');
const iconv = require('iconv-lite');

// 要访问的目标网址
const targetUrl = "http://book.dangdang.com/";

//不断读取流数据并放入数组中，直到全部读取完就将数组中的数据转换为utf8编码的字符串
axios.get(targetUrl, { responseType: 'stream' })
    .then(function (response) {
        //此时的res.data 则为stream
        let chunks = [];
        //'data'当有数据可读时触发。
        response.data.on('data', function (chunk) {
            chunks.push(chunk);
        });
        //'end'没有更多的数据可读时触发
        response.data.on('end', function () {
            let buffer = Buffer.concat(chunks);
            //使用iconv将'gbk'编码的buffer解码转换为'utf8'的字符串
            let str = iconv.decode(buffer, 'gbk');
            console.log(str)
        })
    })
    .catch(function (error) {
        console.log(error);
    });

• 运行结果
  
  从上方运行结果可以看出，中文乱码的问题已经解决。