说明，作为一名前端世界的小学生，一??直想着自己做一些项目，为全栈而努力。担心的是没有背景。经过搜索，学习了nodejs和express写了一个本地接口供前端页面调用。但是，数据从何而来？有人说，“Mockjs来生成！”ok，引入mock，循环生成一些随机数据，列表形成，还可以加载更多，表格行数据填充，还可以增删改查，曲线的绘制就是也从原来的平行线变成了跌宕起伏。不过，那毕竟是假数据。想要得到真实的数据，还是得上“蜘蛛网”，稍微实战一点经验。很基础，不喜勿喷...转载并注明出处：Link'sNodejs爬虫实战项目效果图1.爬虫是如何实现的？通过访问要爬取的网站地址，获取页面html文档的内容，找到我们需要保存的数据，进一步查看数据所在的元素节点。它们必须以某种方式有规律，遵循规则，操作DOM，保存数据。比如：先访问链家新房楼盘，看到这样一个列表，我们需要的数据无非就是楼盘的图片，链接地址，名称，位置，房型，建筑面积，特色，户型，价格。..接下来按F12看看这些数据在哪，可以看到都一一存放在li里面，然后找到图片所在的位置。对于这样一个页面的十里，我们可以通过'.house-lst来使用每一张图片。pic-panelimg'，所以我们在代码中就是这样找到图片元素的，一次可以找到十个，遍历存储。不要找别人，如果找不到，可以通过源码联系，想想自己为什么这么做？2、如何爬取所有页面的所有数据？按照刚才的方法，我们可以爬到第一页的数据并保存，但是如果要爬到所有页面的数据，还是需要找到页码之间的规律。接下来，我将尝试访问第二个页面，看看是否有什么样的飞蛾？在原来路径的基础上，循环添加/pg{i}/不就可以了吗？技术栈后台：Nodejs+express+mongodb(mongoose)+superagent+cherrio前端：React+React-Router(v4)+Ant-design+百度地图+Echarts（后续添加）交互：expressAPI+socket.io第一步，新建一个项目npminstall-gcreate-react-appcreate-react-appnodejs-spidercdnodejs-spider2.背景部分1.安装依赖包npminstall--saveexpressmongodbmongoosesuperagentcherriosocket.iobody-parser2.新建server.js写个后台服务看看效果就知道，爬取过程是一个页面一个页面的爬取，爬取完这个页面才会爬下一个页面。如果不这样做，他会忽略抓取时间，直接显示所有页面的抓取提示，并说明抓取完成。其实他在接下来的时间里还会继续爬取，所以我们不知道什么时候结束，以及如何通知前端显示爬取的进度呢？所以这里使用ES7的async/await。传送门：体验异步的终极解决方案——ES7的Async/Await3.前端部分1.安装依赖包npminstall--savereact-routerantd2.配置环境Create-react-app+Antd+Less配置3.Routingand组件的整体布局是header导航栏+content+bottomheaderandtail是通用的，content部分通过两条路由指向两个组件。//routingexportimportMapfrom'../components/Map';importChartfrom'../components/Chart';exportdefault[{path:'/',name:'Map',component:Map},{path:'/page/Chart',name:'DataAnalysis',component:Chart}]//路由渲染
