抓取网页数据(动态网页数据源获取需要抓取的页面是什么意思？|)

　　抓取网页数据(动态网页数据源获取需要抓取的页面是什么意思？|)

　　在做一些数据采集工作之前，也踩过一些坑，所以有了这个文章。

　　动态网页数据源获取

　　需要爬取的页面是使用React JavaScript框架开发的，所有的页面都是在客户端渲染的，也就是说我只能一一看到data-id，没有办法获取数据直接地。这涉及到一个我之前没有接触过的领域——动态网络爬取。google了一下，了解到动态网页爬取一般可以通过以下两种方式实现：

　　第二种方式相当于在命令行运行浏览器，一次打开一页，效率可想而知。另外，要爬取的页面的DOM结构比较复杂，并且没有添加对应的class和id，即使渲染后也很难抓取到自己需要的数据。所以只能采用第一种方案：分析网页的代码后发现所有的数据都是通过一个接口返回的。使用 Chrome 检查工具中的网络工具获取所有网络请求，在其中搜索 JSON，找到一个 JSON 请求。点击它正是我们需要的数据，解决了动态web数据源的问题。

　　分类不统一

　　这个坑主要是目标网页的数据挖掘不足。一开始以为目标页面是按照具体的分类来分类的，后来发现这个标准不统一，最后抓到的数据也不是一维的。就在我准备开始写很多特别判断的时候，我发现如果我从另一个维度去求数据，所有的数据都会统一起来。在这种情况下，将人工分类切换为通过价格获取数据。通过选择所有的价格，可以得到所有的数据，不需要对不同维度的分类做特殊判断。这与其说是技术问题，不如说是经验问题。

　　页面内部的JS执行

　　这个坑比较有意思。目标网页除了通过特定的接口获取数据外，还通过页面内部的 JavaScript 直接传递数据。其背后的技术考虑尚不清楚，但摆在我面前的问题是如何获取这段 JavaScript 代码中的数据。想了一会儿，我想出了两个选择：

　　自匹配的问题是我需要匹配的字符串格式不同，很难直接匹配到我需要的数据。并且通过 phatomjs 执行，可以更好的解决这个问题。

　　一个肮脏的解决方案是：

　　将整个 HTML 页面下载到 test.html 以获取所有