nodejs爬虫制作知乎专栏RSS

现在这个社会是信息爆炸的社会,各个网站、app上铺天盖地的都是各种新闻和信息。
为了获取信息,我们每天都要进行各种麻烦的操作,打开各种网站或者手机app,操作显得低效,后来发现了一个神器,那就是RSS。

什么是RSS

RSS中文名是简易信息聚合,就是让网站一个按照一定周期更新网站的文章概要内容(有些是全文)到一个xml中。RSS订阅工具一定时间抓取这个RSS订阅源生成数据供订阅者读取网站内容。
有了RSS,你只要去订阅工具上就可以浏览你自己订阅的新的更新内容,非常简单高效。这里推荐一个RSS订阅神器inoreader,支持中文。这个我认为是目前最好的RSS订阅器。
知乎专栏是一个知乎开给个人写的博客,有些专栏上面具有有价值的信息,但是很遗憾知乎专栏不提供RSS订阅,当然作为开发者来说,我们可以自己动手做一个知乎专栏RSS抓取程序。
此处输入图片的描述

inoreader界面截图
######制作爬虫 很多网站提供了RSS,但是更多网站其实没有提供RSS订阅源。我们可以使用爬虫抓取网站更新内容制作个人的RSS订阅源。我作为一个前端er可以使用**nodejs**来进行RSS的制作。 ######什么是nodejs >Node.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞I/O 模型而得以轻量和高效,非常适合在分布式设备上运行数据密集型的实时应用。

简单的说 Node.js 就是运行在服务端的 JavaScript。使用nodejs的可以让你一个只会用JavaScript也能写后端服务代码。当然也能用它进行爬虫抓取的工作。

先安装爬虫所需依赖

进行爬取工作的话先要安装所要用到的依赖。
superagent是最常用的一个依赖库,利用它可以轻松发送各种请求。
cheerio就是一个nodejs版本的jquery,利用它可以获取网页中的各种dom结构。
data2xml就是一个json转化成xml的一个库。
其他还有node-schedulefs就是进行定时操作和文件操作。

新建一个文件夹rssmaker,并且执行npm init创建package.json。
此处输入图片的描述

npm install node_modules_name --save来进行安装各种依赖。

分析知乎专栏结构获取要爬取的入口

我这次举例爬取一个专栏前端学习指南。想这种适配手机端的网页,一般都有采用发送API请求来获得数据进行前端渲染页面,我们可以用chromenetwork的查看可疑的请求。打开chrome的开发者工具。我们很快就发现了一个目标。一个可疑请求https://zhuanlan.zhihu.com/api/columns/study-fe/posts?limit=20
此处输入图片的描述

此处输入图片的描述

我们得到了一个json,我们现在使用一个json的查看工具chrome的插件JSON Editor可视化这个json数据方便我们进行分析。

此处输入图片的描述

我们可视化后数据如下

此处输入图片的描述

前面我们发现的请求发送里面有一个参数是limit,他的值是20,从上图我们知道了我们得到了20组数据,这个参数其实就是限制获取的数据条目数。我们现在分析20组里面的一条数据。

{
    "isTitleImageFullScreen": false,
    "rating": "none",
    "sourceUrl": "",
    "publishedTime": "2016-12-28T15:01:44+08:00",
    "links": {
      "comments": "/api/posts/24606606/comments"
    },
    "author": {
      "profileUrl": "https://www.zhihu.com/people/jirengu-ruo-yu",
      "bio": "饥人谷的挑山工    jirengu.com",
      "hash": "3dd61d987210ce6b0ba24746803e04bb",
      "uid": 33284922802176,
      "isOrg": false,
      "description": "饥人谷的挑山工    jirengu.com     ",
      "isOrgWhiteList": false,
      "slug": "jirengu-ruo-yu",
      "avatar": {
        "id": "31a3446681c9040f3643472db505a6ef",
        "template": "https://pic4.zhimg.com/{id}_{size}.jpg"
      },
      "name": "若愚"
    },
    "url": "/p/24606606",
    "title": "前端笔试面试题库",
    "titleImage": "",
    "summary": "",
    "content": "<h2>做了什么?</h2><p>我们在建了 GitHub 前端笔试面试题库 <a href=\"https://github.com/jirengu/frontend-interview/issues\" data-editable=\"true\" data-title=\"前端笔试面试题库\" class=\"\">前端笔试面试题库</a>, 欢迎走访</p><br><br><h2>为什么建前端笔试面试题库?</h2><p><a href=\"https://zhuanlan.zhihu.com/study-fe\" data-editable=\"true\" data-title=\"前端学习指南专栏\" class=\"\">前端学习指南专栏</a> 专栏创建3个月有很多前端爱好者特别是入门者关注,很多小伙伴一直期待我们能做一份笔试面试题集锦分享给大家,我和方方也一直想把这个事情做好。但两个人的力量太微弱,于是想到在 github 上建立公共项目,汇集更多前端爱好者的力量一起收集前端常见笔试面试题,作为送给前端入门的小伙伴、需要找工作的小伙伴一份新年礼物🎁</p><br><br><h2>如何贡献题目?</h2><p>大家可以在 【[Issue](<a href=\"https://github.com/jirengu/frontend-interview/issues\" data-editable=\"true\" data-title=\"jirengu/frontend-interview\" class=\"\">jirengu/frontend-interview</a>)】上通过提交Issue的形式提交日常遇到的笔试面试题,无论是多\"高端\"或者多\"低级\"。</p><img src=\"v2-7321f409275270493625137ca12521b0.png\" data-rawwidth=\"1972\" data-rawheight=\"878\"><br><p><b>注意: </b></p><ol><li>提交 Issue 的时候需要在问题里加上问题来源,比如:`来自百度校招笔试题`,或者来自`某公司面试题`<br></li><li> 在提交Issue 的时候需要选择合适的标签以便分类整理。目前的标签有 `HTML&amp;CSS`、`JavaScript`、`前端框架`、`HTTP`、`未归类`,如果你不知道该选择什么标签,就选择`未归类`吧。或者可以在题目的描述里加上自己觉得应该添加的标签,项目管理者会定期更新添加新标签<br></li><li>当前项目的主题是 <b>前端笔试面试题</b>,不要把自己平时学习中的疑问放进去,要的是货真价实的笔试面试题。否则变味了就没人喜欢了<br></li></ol><br><h2><br>如何贡献答案?</h2><p>不要吝啬自己的答案,在脑子里的答案不叫答案,只有写下来后才知道答案没那么简单,面试官真问起的时候才能对答如流</p><p>勇敢的回复自己的答案吧</p><br><p>觉得不错?</p><p>Star 这个项目, Watch 这个项目,分享给其他小伙伴吧</p>",
    "state": "published",
    "href": "/api/posts/24606606",
    "meta": {
      "previous": null,
      "next": null
    },
    "commentPermission": "anyone",
    "snapshotUrl": "",
    "canComment": false,
    "slug": 24606606,
    "commentsCount": 20,
    "likesCount": 135
  }

此处输入图片的描述
此处输入图片的描述
此处输入图片的描述

我们可以通过《XML那些事...》 实现简单的RSS可知RSS几个关键的值。跟上图截图的对应。

在一个RSS文档的开头是一个<rss>节和一个规定属性version,该属性规定了该文档将已RSS的哪个版本表示。

如果该文档以这个规范来表示,那么它的version属性就必须等于2.0。

在一个<rss>节点的下一级是一个独立的<channel>节点,该节点包含关于channel的信息和内容。(这个是必要的节点)内容信息使用<item>节点表示,<item>的子节点有title、link、author、pubDate、description。

以下标签是我们必须遵守的:

rss:每个RSS Feed,都有而且只能有一个rss标签,作为顶层元素
channel:在RSS标签下,必须有且只能有一个channel标签

    item:可以出现多个item,每个item,描述一条日志信息
    title:日志的标题
    link:日志的URL访问地址
    author:日志的作者
    pubDate:日志的发布日期
    description:日志的内容

我们现在知道爬取的入口,那么我们现在开始coding吧。

用superagent抓取数据组成数组

新建一个文件studyfe.js,在文件中用require引入各种依赖。然后我们用superagent获取数据后进行数组的拼装。

//引入superagent库
const superagent = require('superagent');
//json 2 xml
const convert = require('data2xml')({
    attrProp: '@',
    valProp: '#',
    cdataProp: '%'
});
// 定时抓取
const schedule = require('node-schedule');
// 写入文件操作
const fs = require('fs');

var grabWeb = superagent.get('https://zhuanlan.zhihu.com/api/columns/study-fe/posts?limit=20')
    .end(function (err, sres) {
        // 常规的错误处理
        if (err || !sres.ok) {
        }
        let content = sres.text;
        content = eval('(' + content + ')');
        let items = [];
        //拼接RSS的item数组内容
        for (let contenItem of content) {
            //拼接封面图
            let detailc = '<![CDATA[' + '<img border="none" src="' + contenItem.titleImage + '">' + contenItem.content.replace(/src=\\?"(.*?)\.(jpg|png|jpeg|bmp|gif)\\?"/g, 'src="https://pic1.zhimg.com/' + '$1' + '.' + '$2' + '"') + ']]>';
            items.push({
                title: contenItem.title,
                link: 'https://zhuanlan.zhihu.com/study-fe' + '/' + contenItem.url + '?refer=' + 'study-fe',
                author: contenItem.author.name,
                pubDate: contenItem.publishedTime,
                description: detailc
            })
        }
        console.info(items);//打印查看数组数据
    });

而在得到这个数组的时候,我们已经相当于得到了所有要采集的数据了,那下面要做的东西就很简单了,那就是json数组转化成xml格式。而转化我们我们要用到data2xml这个库。在开头我们已经require进来了。
data2xml的使用文档可以查看data2xml-npmjs.com

let rs = convert(
            'rss', {
                '@': {
                    version: '2.0'
                },
                channel: {
                    'title':config.name,
                    'link':config.link,
                    'description':config.description,
                    'generator':config.name,
                    'image':{
                        'url':config.icourl,
                        'title':config.name,
                        'link':config.link
                    },
                    item:items
                } 
            });

最后就是把数据输出到文件中去

fs.writeFile(config.dist, fs, function(err) {
            if (err) throw err;
            // console.log('It\'s saved!'); //文件被保存
        });

输出到文件之后,然后要把这个文件放到服务器上,这样才能被rss服务器抓取到,如何放在服务器上这本文就不讨论了,还有一个问题就是RSS需要实时更新的,所以还有使用定时抓取,这次用到的是node-schedule。里面的定时写法其实跟linux中的crontab定时任务写法是很相似的。下面的代码其实代表着每3分钟定时执行一次。

var j = schedule.scheduleJob('*/3 * * * *', function() {
     grabWeb();
 });

定时执行任务还会有一个问题就是在nodejs在执行异常的时候退出,这样就会导致不会实时抓取,这个要用到一个nodejs中能自动重启任务的,我用的是pm2
pm2的使用教程可以看这里,本文不详细展开。

最后,我是在linux环境下写出此教程的,实际跑的程现在放在vps上,在windows下不知道会出现什么问题,自己实践吧。全部代码已经上传到github。

链接地址:rssmaker-github

参考资料

nodejs爬虫实战(一):抽屉新热榜
《XML那些事...》 实现简单的RSS
《XML那些事...》 XML中的元素、属性、命名空间

comments powered by Disqus