最近在在学node.JS，尝试着跟着网上的教程学着写一个JS爬虫,来爬取网上的图片文件，在此记录过程
获取网站的html结构
首先我们引入node.js的http核心模块，初始化并将目标网站地址作为url参数，接受一个回调函数，在这个回调函数里我们可以通过res.on方法对返回值进行监听，当有数据流入时，我们将他放进我们提前准备好的数组中，当数据结束流入时，我们将数组中的所有数据连接起来并以流的形式输出，存入一个变量中，打印这个变量，控制台就会出现整个页面的html结构。
```javascript
`const http = require('http');
let req = http.request('http://www.itheima.com/teacher.html#ajavaee', res => {
let chunks = [];
res.on('data', chunk => {chunks.push(chunk);
})
let img = [];
res.on('end', () => {// console.log(Buffer.concat(chunks).toString('utf-8'))let htmlstr = Buffer.concat(chunks).toString('utf-8')})
req.end();`
页面原本的HTML结构：
获取图片src
虽然我们这时已经获取到了整个页面的HTML结构，但这时整个结构是在控制台呈现的，我们并没有解析这个结构的能力，所幸我们可以通过一个插件来完成这个工作，我们可以下载cherrio这个插件对这个结构进行解析，这个插件支持我们用jQuery的语法对解析出来的html结构进行操作。首先我们要下载并引入这个插件
下载
`npm install cheerio`
引入
`const cherrio = require('cheerio')`
然后，我们要对这个解析出的html进行挂载，将它们整体挂在在$上，然后用jqury的语法进行调用
` let $ = cherrio.load(htmlstr);`
然后，我们要点目标网站，打开控制台对整个HTML文件结构进行分析，然后用jQuery的语法对我们要提取的图片的DOM进行选择$(’.tea_box4 .maincon .clears > li .main_pic >img’)，这时我们可以用attr来选中目标img的src，但这个方法只能选中一个，我们需要所有的src就必须对他进行遍历，注意由于这个插件是jQuery的语法，因此我们需要使用each方法进行遍历，这个方法的第一个参数是索引，第二个才是每一项。同时注意，使用每一个item也要用jQuery的语法进行
` $('.tea_box4 .maincon .clears > li .main_pic >img').each((index, item) => {img.push($(item).attr('src'))})`
这里的img是我们提前定义好的一个空数组，用来保存这些图片地址。我们在控制台打印img已经可以看到地址了，但我们会发现这些地址都打不开，这是因为这些图片的位置是相对地址，我们在这些地址前需要补上网站的Baseurl,我们可以将网站的baseurl作为一个常量，在每次遍历时添加
`设置常量
const HOST = 'http://www.itheima.com/'`each遍历部分：img.push(HOST + ($(item).attr('src')))
批量下载
现在，我们已经可以打印出这些可以打开的地址了，现在我们要做的是将他们批量下载下来，这时我们可以使用download这个插件对这些图片地址进行批量下载
下载
`npm install download`
引入
`const download = require('download')`
调用的方式非常简单，只要用一个Proimse即可
` Promise.all(img.map(x => download(x, 'dist'))).then(console.log('图片下载完成'))`
这个函数中，x是img这个包含了所有要下载的url中的每一项，dist是下载的文件夹，不指定路径则为同级文件夹，then()来指定下载完成后的回调函数。
注意这里还有一个细节，由于这个下载的连接中不能包含中文，所以我们要对图片url中的中文处理为base64，我们使用node.js中自带的encodeURL即可。
```javascript` $('.tea_box4 .maincon .clears > li .main_pic >img').each((index, item) => {img.push(HOST + encodeURI($(item).attr('src')))})`
运行程序，即可成功。
注意，用vscode打开单个JS文件可能导致显示下载成功但没有文件，只要打开爬虫JS文件所在的文件夹姐会成功了
全部代码：
```javascript`const http = require('http');const cherrio = require('cheerio')const download = require('download')const HOST = 'http://www.itheima.com/'let req = http.request('http://www.itheima.com/teacher.html#ajavaee', res => {let chunks = [];res.on('data', chunk => {chunks.push(chunk);})let img = [];res.on('end', () => {// console.log(Buffer.concat(chunks).toString('utf-8'))let htmlstr = Buffer.concat(chunks).toString('utf-8')let $ = cherrio.load(htmlstr);$('.tea_box4 .maincon .clears > li .main_pic >img').each((index, item) => {img.push(HOST + encodeURI($(item).attr('src')))})Promise.all(img.map(x => download(x, 'dist'))).then(console.log('图片下载完成'))})})req.end();`
