先来段求分小视频:

https://www.iesdouyin.com/share/video/6550631947750608142/?region=CN&mid=6550632036246555405&titleType=title&timestamp=1525407578&utm_campaign=client_share&app=aweme&utm_medium=ios&iid=30176260384&utm_source=qq&tt_from=mobile_qq&utm_source=mobile_qq&utm_medium=aweme_ios&utm_campaign=client_share&uid=92735989673&did=30176260384

本文的教学视频地址:

https://v.qq.com/x/page/b0643tut4ze.html

前言
 
本喵最近工作中需要使用node,并也想晋升为全栈工程师,所以开始了node学习之旅,在学习过程中,
我会总结一些实用的例子,做成博文和视频教程,以实例形式来理解体会node的用法,所以跟小猫一起由浅及深的学node吧!
近期都会是些基础文章,主要用来了解node的各种功能,非常适合对node有所了解但没有开发node基础的前端工程师,
等基础掌握后,后续会进行进阶的探索和总结哟
 
 
本文将以抓取百度搜索结果中关键词的相关搜索为例子,教会大家以nodejs制作最简单的爬虫:
 
 
将使用的node模块及属性介绍:
 
request:
 
     用于发送页面请求,抓取页面代码
     GET请求
     

cheerio:
        
   cheerio 是一个 jQuery Core 的子集,其实现了 jQuery Core 中浏览器无关的 DOM 操作 API:
   本例子中将使用load方法,以下是一个简单的示例:
     
 
express:
 
     基于Node.js 平台,快速、开放、极简的 web 开发框架,这里主要用来做简单的路由功能,就不做详细介绍了,主要是用了get,具体可以参考官网。
 
 
具体实现:
 
1.首先,我们要使用express搭建简单的node服务
 

 const request = require('request');
const app = express(); app.get('/:key',function(req,res){
console.log(req.params.key) }) app.listen(3000,()=>{
console.log("service start on port 3000");
})
 
使用命令行运行node demo.js,并在浏览器中访问 localhost:3000/key 运行结果为
 
 
 
2. 使用request实现页面抓取功能
 
 const express = require('express');
const request = require('request');
const app = express(); app.get('/:key',function(req,res){
console.log(req.params.key)
let spider = new Spider();
spider.fetch("http://www.baidu.com/s?wd="+req.params.key,(err,body)=>{
if(!err){
res.send(body.toString());
}
})
}) app.listen(3000,()=>{
console.log("service start on port 3000");
}) class Spider{
fetch(url,callback){
request({url: url, encoding : null}, (error, response, body)=>{
if (!error && response.statusCode === 200){
callback(null ,body);
}else{
callback(error ,'<body></body>');
}
});
}
}
使用命令行运行node demo.js,并在浏览器中访问 localhost:3000/key 运行结果为
 

 
3.使用cheerio将页面代码解析为jquery格式,并用jQuery语法找到抓取的内容位置,这样这个爬虫就实现了!

 const express = require('express');
 const request = require('request');
const app = express();
const cheerio = require('cheerio'); app.get('/:key',function(req,res){
let spider = new Spider(); spider.fetch("http://www.baidu.com/s?wd="+req.params.key,(err,$)=>{
spider.fetchCallback(err,$,res)
})
console.log("http://www.baidu.com/s?wd="+req.params.key)
}) app.listen(3000,()=>{
console.log("service start on port 3000");
}) class Spider{
fetch(url,callback){
request({url: url, encoding : null}, (error, response, body)=>{
if (!error && response.statusCode === 200){
callback(null ,cheerio.load('<body>'+body+'</body>'));
}else{
callback(error ,cheerio.load('<body></body>'));
}
});
}
fetchCallback(err,$,res){
if(!err){
let keyList = [];
let table = $('body').find("#rs table").html();
res.send(table);
} }
}
 
使用命令行运行node demo.js,并在浏览器中访问 localhost:3000/index 运行结果为
tips:
有些网站不是utf-8编码模式,这时可以使用iconv-lite来解除gb2312的乱码问题
当然各个网站都有反爬虫功能,可以通过 研究怎么模拟一个正常用户的请来规避部分问题(百度的中文搜索也会被屏蔽)
本文只是个入门,后序有机会将和大家详细讨论进阶版
 
谢谢大家的关注
 
 

每天几分钟跟小猫学前端之node系列:用node实现最简单的爬虫的更多相关文章

  1. 只需几分钟跟小猫学前端(内含视频教程):nodejs基础之用express、ejs、mongdb建设简单的网站

    开门见山视频教程 https://v.qq.com/x/page/d0645s79xrq.html 前 言: 这是小猫的第二篇node教程,第一篇教程是一个简单的试水,小猫的node教程面向对象为没有 ...

  2. 原生JS实现轮播+学前端的感受(防止走火入魔)

    插件!插件!天天听到有人求这个插件,那个插件的,当然,用第三方插件可以大幅提高开发效率,但作为新手,我还是喜欢自己来实现,主要是我有时间! 今天我来给大家分享下用原生JS实现图片轮播的写法 前辈们可以 ...

  3. 重学前端 --- Promise里的代码为什么比setTimeout先执行?

    首先通过一段代码进入讨论的主题 var r = new Promise(function(resolve, reject){ console.log("a"); resolve() ...

  4. ife 零基础学院 day 1 - 我为什么想学前端

    与前端结缘   我是后端研发,毕业四年,用了四年C#,一开始写ASP.NET,有时会在asp页面写简单的js和html,做点css样式调整.当时的感触是前端调试太费劲了,因为没有js.html.css ...

  5. 结合jquery的前后端加密解密 适用于WebApi的SQL注入过滤器 Web.config中customErrors异常信息配置 ife2018 零基础学院 day 4 ife2018 零基础学院 day 3 ife 零基础学院 day 2 ife 零基础学院 day 1 - 我为什么想学前端

    在一个正常的项目中,登录注册的密码是密文传输到后台服务端的,也就是说,首先前端js对密码做处理,随后再传递到服务端,服务端解密再加密传出到数据库里面.Dotnet已经提供了RSA算法的加解密类库,我们 ...

  6. 重学前端--js是面向对象还是基于对象?

    重学前端-面向对象 跟着winter老师一起,重新认识前端的知识框架 js面向对象或基于对象编程 以前感觉这两个在本质上没有什么区别,面向对象和基于对象都是对一个抽象的对象拥有一系列的行为和状态,本质 ...

  7. 15分钟带你了解前端工程师必知的javascript设计模式(附详细思维导图和源码)

    15分钟带你了解前端工程师必知的javascript设计模式(附详细思维导图和源码) 前言 设计模式是一个程序员进阶高级的必备技巧,也是评判一个工程师工作经验和能力的试金石.设计模式是程序员多年工作经 ...

  8. css与javascript重难点,学前端,基础不好一切白费!

    JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果.通常JavaScript脚本是通过嵌入在HTML中来实现 ...

  9. 学前端的第一门语言HTML

    学前端最终要做的就是制作各种各样的网页,html就相当于网页的骨架,所以我们学习前端的第一步就是先学html,接下来学习什么是html. 什么是HTML? HTML指的是超文本标记语言(Hyper T ...

随机推荐

  1. Android的RadioButton和checkBox的用法-android学习之旅(十九)

    RadioButton和checkBox简介 单选按钮(RadioButton)和复选框(CheckBox)都继承了Button,因此属性的设置和Button差不多,只是加了一个android:che ...

  2. 后端分布式系列:分布式存储-HDFS 架构解析

    本文以 Hadoop 提供的分布式文件系统(HDFS)为例来进一步展开解析分布式存储服务架构设计的要点. 架构目标 任何一种软件框架或服务都是为了解决特定问题而产生的.还记得我们在 <分布式存储 ...

  3. Android开发模式之MVC,MVP和MVVM的简单介绍与区别

    相信大家对MVC,MVP和MVVM都不陌生,作为三个最耳熟能详的Android框架,它们的应用可以是非常广泛的,但是对于一些新手来说,可能对于区分它们三个都有困难,更别说在实际的项目中应用了,有些时候 ...

  4. javascript setinterval 正确的语法

    前几天我用setinterval 写了一个小程序,这个setinterval是用来干什么的我就不解释了. 写的方法在其它的浏览器里都能用,后来测试组的同事拿去一测就出了问题.因为她们爱用360,还有I ...

  5. Android源码浅析(三)——Android AOSP 5.1.1源码的同步sync和编译make,搭建Samba服务器进行更便捷的烧录刷机

    Android源码浅析(三)--Android AOSP 5.1.1源码的同步sync和编译make,搭建Samba服务器进行更便捷的烧录刷机 最近比较忙,而且又要维护自己的博客,视频和公众号,也就没 ...

  6. 调用start()方法和直接调用run()方法的区别

    调用start()方法和直接调用run()方法的区别 新建一个线程,只需要使用new关键字创建一个线程对象,并且调用start()方法即可. Thread thread = new Thread(); ...

  7. Libgdx 1.6.1发布,跨平台游戏开发框架

    Libgdx 1.6.1发布 [1.6.1] 英文原文:http://www.badlogicgames.com/wordpress/?p=3694 译文翻译:宋志辉 - Net.newServerS ...

  8. xml作用以及语法

    2 XML作用 2.1 描述带关系的数据(软件的配置文件) web服务器(PC): 学生管理系统 -> 添加学生功能 -> 添加学生页面 -> name=eric&email ...

  9. [WinForm]最小化到系统托盘,右键退出

    1.拉出一个notifyIcon1到用户界面,也可以NEW一个 2.拉出一个ContextMenuStrip控件,命名为mymenu,集合中增加退出 3.notifyIcon1的属性ContextMe ...

  10. 【Unity Shaders】Diffuse Shading——创建一个基本的Surface Shader

    本系列主要参考<Unity Shaders and Effects Cookbook>一书(感谢原书作者),同时会加上一点个人理解或拓展. 这里是本书所有的插图.这里是本书所需的代码和资源 ...