很久没有写有关爬虫相关的内容了,今天给大家分享一下最近工作中遇到的一个与JavaScript相关的数据采集案例。
在某平台的后台,有这样一个页面需要进行采集:
如图所示,图片中分为了上下两个部分,一个是概况类的数据,一个是明细列表类的数据。
根据以往的经验,直接F12
打开浏览器的网页调试控制台,筛选到其数据接口的请求地址:
轻车熟路地从数据接口返回的json
数据中提取各个数据值。
本以为是一个轻松的事情,没想到最后一个成交转化率的数据值总是找不到,翻遍了所有的请求接口都找不到。
怎么办?
本着数据不会无缘无故产生的原则,逐步进行分析。
首先从响应的HTML页面开始分析,数据肯定不会是直接从后端渲染到HTML页面上的。在HTML上只是为了寻找一些调用和渲染数据的蛛丝马迹。
果然发现了:
这3个被{{}}
模板渲染标签包裹的变量名显然就是待采集数据项中的3个,前2个变量名可以一一对应到具体的数据上,那么最后一个也就是找不到数据值的数据变量名了。
接着继续在网页控制台进行搜索,发现有两个请求存在这个变量名:
其中一个是上述的HTML响应,另一个则是一个JS文件。我们重点来关注这个JS。
显然,JS是被压缩过的,为了方便分析,我们对其进行格式化处理:
复制出来,搜索变量名附近的代码:
原来这个数值是通过计算的出来的,难怪找不到具体的数据值。
来看这个计算公式,一个数据已有的变量值,另一个数据则是从ssesionStorage
中取出的。咱们继续掉头回到浏览器网页调试栏:
在ssesionStorage
存储中找到了对应的值,进而发现这个值存在于前一个数据接口的响应中,这样,这一个永远找不到的数据就这样轻松解决了。