抓取jsp网页源代码(网页分析工具（Chrome开发者工具）对网页进行抓包分析)

　　抓取jsp网页源代码(网页分析工具（Chrome开发者工具）对网页进行抓包分析)

　　在这篇文章文章中，我们将尝试使用一个直观的网页分析工具（ChromeDeveloper工具）来捕获和分析网页

　　1、测试环境

　　浏览器：Chrome浏览器

　　浏览器版本：67.0.339 6.99（官方版本）（32位）

　　Web分析工具：开发人员工具

　　2、web页面分析（1）web页面源代码分析）

　　我们知道网页可以分为静态网页和动态网页。许多人会错误地认为静态网页是没有动态效果的网页。事实上，这种说法是错误的

　　另外，目前很多动态网站都采用了异步加载技术（Ajax），这也是捕获的源代码多次与网站显示的源代码不一致的原因

　　对于如何抓取动态网页，有两种方法：

　　我们以京东产品为例，分析如何通过chrome抓取软件包。首先，我们打开产品的主页

　　

　　右键单击网页空白处并选择查看网页源代码（或使用快捷方式CTRL+U直接打开）

　　请注意，当您查看网页的源代码时，您会得到网站最原创的源代码，即我们通常获取的源代码

　　

　　再次进入网页空白处，右键单击并选中（或使用快捷键CTRL+Shift +I/F12直接打开）

　　请注意，检查结果是由Ajax加载并由JavaScript呈现的源代码，即当前网站显示内容的源代码

　　

　　通过比较，我们可以发现两者的内容是不同的，这是异步加载技术（Ajax）的一个典型例子

　　目前，京东产品的价格至少是通过异步加载生成的。这里有三种方法来判断网页中的内容是否是动态生成的：

　　

　　（2）web页面数据包捕获分析）

　　让我们以京东商品为例来说明。打开商品主页，尝试捕获动态加载的商品价格数据

　　使用快捷键Ctrl+Shift+I或F12打开开发者工具，然后选择网络选项卡进行数据包捕获分析

　　此时，按快捷键F5刷新页面。您可以看到开发人员工具中出现了各种包。我们使用filter来过滤包

　　

　　首先，选择doc，您可以看到列表中只显示一个包

　　一般来说，这是浏览器收到的第一个数据包，用于获取网站请求的原创源代码@

　　单击“标题”以查看其标题参数设置

　　单击响应以查看返回的源代码。很容易发现它实际上与通过查看网页源代码返回的信息一致

　　

　　让我们回到正题上来。对于动态加载的数据包捕获分析，我们可以主要查看XHR和JS选项卡

　　选择JS进行筛选，发现列表中出现了许多包。分析之后，我们过滤下图中标记的包

　　此包返回有关价格的信息，但经过仔细分析，发现这些价格不属于当前商品，而是属于相关商品

　　

　　但是，我们怎么能说这个方案与价格有关呢？让我们首先看看这个包的请求URL

　　https://p.3.cn/prices/mgets?callback=jQuery1609108&type=1&area=1_72_2799_0&pdtk=&pduid=1539779074977382417990&pdpin=&pin=null&pdbp=0&skuIds=J_25630711066%2CJ_26395831446%2CJ_20823451030%2CJ_11332156897%2CJ_14020547214%2CJ_26498549638&ext=11100000&source=item-pc

　　过滤回调等不必要的参数，以获得简单有效的URL

　　https://p.3.cn/prices/mgets?skuIds=J_25630711066%2CJ_26395831446%2CJ_20823451030%2CJ_11332156897%2CJ_14020547214%2CJ_26498549638

　　直接用浏览器打开URL，可以看到返回的JSON数据确实收录价格信息（不幸的是，它是其他商品的价格）

　　

　　通过分析URL的参数，可以推断skuid应该是每个商品的唯一标记。我们在哪里可以找到我们需要的商品的臭鼬

　　事实上，SKU是物流、运输等行业常用的缩写。它的全称是库存单位

　　即存货进出计量的基本单位。现在它已经扩展到统一产品编号的缩写。每个产品对应一个唯一的SKU