现在这个社会是信息爆炸的社会，各个网站、app上铺天盖地的都是各种新闻和信息。为了获取信息，我们每天都要进行各种麻烦的操作，打开各种网站或者手机app,操作显得低效，后来发现了一个神器，那就是RSS。 # 什么是RSS RSS中文名是**简易信息聚合**，就是让网站一个按照一定周期更新网站的文章概要内容（有些是全文）到一个xml中。RSS订阅工具一定时间抓取这个RSS订阅源生成数据供订阅者读取网站内容。有了RSS，你只要去订阅工具上就可以浏览你自己订阅的新的更新内容，非常简单高效。这里推荐一个RSS订阅神器**inoreader**，支持中文。这个我认为是目前最好的RSS订阅器。知乎专栏是一个知乎开给个人写的博客，有些专栏上面具有有价值的信息，但是很遗憾知乎专栏不提供RSS订阅，当然作为开发者来说，我们可以自己动手做一个知乎专栏RSS抓取程序。 ![inoreader界面截图](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20161228163159.png) 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-schedule**和**fs**就是进行定时操作和文件操作。新建一个文件夹`rssmaker`,并且执行`npm init`创建package.json。 ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103153742.png) 用`npm install node_modules_name --save`来进行安装各种依赖。 # 分析知乎专栏结构获取要爬取的入口我这次举例爬取一个专栏[前端学习指南](https://zhuanlan.zhihu.com/study-fe)。想这种适配手机端的网页，一般都有采用发送API请求来获得数据进行前端渲染页面，我们可以用**chrome**的**network**的查看可疑的请求。打开chrome的开发者工具。我们很快就发现了一个目标。一个可疑请求[https://zhuanlan.zhihu.com/api/columns/study-fe/posts?limit=20](https://zhuanlan.zhihu.com/api/columns/study-fe/posts?limit=20) ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103135750.png) ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103140723.png) 我们得到了一个json,我们现在使用一个json的查看工具chrome的插件**JSON Editor**可视化这个json数据方便我们进行分析。 ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103140910.png) 我们可视化后数据如下 ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103141258.png) 前面我们发现的请求发送里面有一个参数是`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": "

做了什么?

我们在建了 GitHub 前端笔试面试题库前端笔试面试题库，欢迎走访

为什么建前端笔试面试题库?

前端学习指南专栏专栏创建3个月有很多前端爱好者特别是入门者关注，很多小伙伴一直期待我们能做一份笔试面试题集锦分享给大家，我和方方也一直想把这个事情做好。但两个人的力量太微弱，于是想到在 github 上建立公共项目，汇集更多前端爱好者的力量一起收集前端常见笔试面试题，作为送给前端入门的小伙伴、需要找工作的小伙伴一份新年礼物

如何贡献题目?

大家可以在【[Issue](jirengu/frontend-interview)】上通过提交Issue的形式提交日常遇到的笔试面试题，无论是多\"高端\"或者多\"低级\"。

注意:

提交 Issue 的时候需要在问题里加上问题来源，比如：`来自百度校招笔试题`，或者来自`某公司面试题`
在提交Issue 的时候需要选择合适的标签以便分类整理。目前的标签有 `HTML&CSS`、`JavaScript`、`前端框架`、`HTTP`、`未归类`，如果你不知道该选择什么标签，就选择`未归类`吧。或者可以在题目的描述里加上自己觉得应该添加的标签，项目管理者会定期更新添加新标签
当前项目的主题是 前端笔试面试题，不要把自己平时学习中的疑问放进去，要的是货真价实的笔试面试题。否则变味了就没人喜欢了

如何贡献答案?

不要吝啬自己的答案，在脑子里的答案不叫答案，只有写下来后才知道答案没那么简单，面试官真问起的时候才能对答如流

勇敢的回复自己的答案吧

觉得不错?

Star 这个项目， Watch 这个项目，分享给其他小伙伴吧

", "state": "published", "href": "/api/posts/24606606", "meta": { "previous": null, "next": null }, "commentPermission": "anyone", "snapshotUrl": "", "canComment": false, "slug": 24606606, "commentsCount": 20, "likesCount": 135 } ``` ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103142313.png) ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103142612.png) ![此处输入图片的描述](https://jimdonoblog.oss-cn-shanghai.aliyuncs.com/ghost-20170103142905.png) 我们可以通过[《XML那些事...》实现简单的RSS](http://www.jianshu.com/p/5dae8f5f2ea0)可知RSS几个关键的值。跟上图截图的对应。 ``` 在一个RSS文档的开头是一个节和一个规定属性version，该属性规定了该文档将已RSS的哪个版本表示。如果该文档以这个规范来表示，那么它的version属性就必须等于2.0。在一个节点的下一级是一个独立的节点，该节点包含关于channel的信息和内容。(这个是必要的节点)内容信息使用节点表示，的子节点有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 = '' + 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](https://www.npmjs.com/package/data2xml) ``` 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的使用教程可以看[这里](http://www.jianshu.com/p/fdc12d82b661)，本文不详细展开。最后，我是在**linux**环境下写出此教程的，实际跑的程现在放在**vps**上,在**windows**下不知道会出现什么问题，自己实践吧。全部代码已经上传到github。链接地址：[rssmaker-github](https://github.com/jimdev5277/rssmaker) # 参考资料 - [nodejs爬虫实战（一）：抽屉新热榜](https://segmentfault.com/a/1190000005343112) - [《XML那些事...》实现简单的RSS](http://www.jianshu.com/p/5dae8f5f2ea0) - [《XML那些事...》 XML中的元素、属性、命名空间](http://www.jianshu.com/p/7ac5db1d6b70) --- *转载自：剑阁前端博客* *文章地址：https://blog.jimdono.com/nodejspa-chong-zhi-zuo-zhi-hu-zhuan-lan-rss/* *作者：jimzhuang*