背景
本人于周六早上惊醒于翠花的电话轰炸中...
image
一大早竟然问这么伤脑筋(愚蠢)的问题
image
本想赶紧打发了 继续我的回笼觉 没想到...
乐（kou）于（shui）助（zhi）人（liu）的我当然要帮帮助他了！
image
看到这里的红色感叹号 不禁眉头一皱
image
打开网站 不出我所料 姹紫嫣红的gif图片差点闪瞎我的钛合金狗眼
image
几番浏览欣赏后收工大吉
image
正文开始
所用到的模块
- http:创建服务、处理流相关
- fs：操作文件及文件夹(读、写)
- cheerio：简单粗暴的理解为node界的juquey
先爬来整张网页
为了该文章正常发出 把翠花提供的链接换成站长之家的链接来演示
// 引入所需模块
var http = require('http');
var cheerio = require('cheerio');
var fs = require('fs');
// 定义爬取目标站
var Url = 'http://sc.chinaz.com/tupian/'
http.get(Url, function (res) {
var htmlDate = '';
// 获取页面数据
res.on('data', function (chunk) {
htmlDate += chunk;
});
// 数据获取结束
res.on('end', function () {
// 过滤出所需的元素
filterContent(htmlDate);
});
}).on('error', function () {
console.log('获取数据出错！');
});
过滤
分析页面结构 看看哪些是需要的 图片都在
#container获取到这个节点
image
遍历.box 并拿到 a > img 的
src和alt
image
// 过滤页面信息
function filterContent(htmlDate) {
if (htmlDate) {
var $ = cheerio.load(htmlDate);
// 得到所需内容
var Content = $('#container');
// 存放一会抓来的信息
var ContentData = [];
Content.find('.box').each(function (item, b) {
var pic = $(this);
// 为什么是src2? src获取不到 打印了一下发现有src2
var src = formatUrl(pic.find('a').children('img').attr('src2'));
var name = formatUrl(pic.find('a').children('img').attr('alt'));
// 把抓来的信息交给download函数去下载
download(src, name)
// 这里也存一份
ContentData.push({
src,
name
})
});
// 存放了抓取的图片信息
console.log(ContentData)
} else {
console.log('html null');
}
}
image
抓取链接都带有_s是缩略图 需要一个方法帮来转换
// 或取高清链接
function formatUrl(imgUrl) {
return imgUrl.replace('_s', '')
}
// 图片下载函数
function download(url, name) {
http.get(url, function (res) {
let imgData = '';
//设置图片编码格式
res.setEncoding("binary");
//检测请求的数据
res.on('data', (chunk) => {
imgData += chunk;
})
res.on('end', () => {
// 没有文件夹则创建 以防报错
if (!fs.existsSync('./images')) {
fs.mkdirSync('./images');
};
fs.writeFile(`./images/${name}.jpg`, imgData, 'binary', (error) => {
if (error) {
console.log(error);
} else {
console.log(`${name}----下载成功！`)
}
})
})
})
}
成果展示
image
image
最后晒出劳动所得
image
