ajax抓取网页内容(网页更新的一个Ajax请求是怎样的?(一) )
优采云 发布时间: 2021-11-03 04:10ajax抓取网页内容(网页更新的一个Ajax请求是怎样的?(一)
)
未完待续
前言:
有时我们使用requests抓取页面时,得到的结果可能与浏览器中看到的不同:在浏览器中可以看到正常显示的页面数据,但是使用reuqest得到的结果是不同的。这是因为获取的请求是原创的 HTML 文档,浏览器中的页面是通过 JavaScript 处理数据的结果。它可能是通过Ajax加载的,可能是收录在HTML文档中,也可能是JavaScript和计算后生成的特定算法。
现在对于第一种情况,数据加载是一种异步加载方法。原创页面最初不会收录一些数据。原创页面加载完成后,会向服务器请求一个接口来获取数据,然后对数据进行处理和呈现。在网页上,这实际上是一个 Ajax 请求。
什么是阿贾克斯:
Ajax,Asynchronous JavaScript and XML,即异步 JavaScript 和 XML。一种使用 JavaScript 与服务器交换数据并更新某些网页,同时确保页面不会刷新和页面链接不会更改的技术。
示例介绍:
在浏览网页时,我们会发现很多网页都有向下滚动查看更多选项。以youtube为例,如下图所示,一直往下滑,可以发现,滑动几次后,会出现一个加载*敏*感*词*。一段时间后,新内容将继续出现在下方。这个过程其实就是Ajax加载的过程。
基本的:
在初步了解了 Ajax 之后,我们将进一步了解其基本原理。向网页更新发送ajax请求的过程可以简单分为以下3个步骤:
发送请求解析内容并渲染网页
发送请求
我们知道JavaScript可以实现页面的各种交互功能。Ajax 也不例外,它也是由 JavaScript 实现的,实际执行如下代码:
var xmlHttp;
if (window.XMLHttpRequest){
// code for IE7+,Firefox,chrome,Opera,Safari
xmlhttp = new XMLHttpRequest();
}else{
// code for IE6,IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status == 200){
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("POST","/ajax",true);
xmlhttp.send();
这是 JavaScript 的 Ajax 的最低级别实现。实际上,它创建了一个新的 XMLHttpRequest 对象,然后调用 onreadystatechange 属性设置侦听器,然后调用 open() 和 send() 方法向链接(即服务器)发送请求。Python中发送请求后,可以得到响应结果,但是这里的请求发送是由JavaScript完成的。由于设置了*敏*感*词*,当服务器返回响应时,就会触发onreadystatechange对应的方法,然后就可以在这个方法中解析响应内容了。
解析内容
得到响应后,会触发onreadystatechange属性对应的方法。这时候可以通过xmlhttp的responseText属性获取响应内容。这类似于Python中使用requests向服务器发起请求,然后得到响应的过程。那么返回的内容可能是HTML或者JSON,那么你只需要在方法中使用JavaScript进行进一步处理即可。
例如,如果是 JSON,则可以对其进行解析和转换。
渲染网页
JavaScript 具有更改网页内容的能力。解析响应内容后,您可以调用 JavaScript 对解析后的内容执行网页的下一步处理。比如通过document.getElementById().innerHTML等操作,可以对元素中的源代码进行更改、删除等操作。
上例中document.getElementById("myDiv").innerHTML = xmlhttp.responseText会将ID为myDiv的节点内部的HTML代码改为服务器返回的内容,这样服务器返回的新数据就会出现在里面myDiv 元素,页面的一部分似乎已更新。
我们看到这三步其实是由JavaScript来完成的,它完成了请求、解析、渲染的整个过程。回想youtube的下拉刷新,这其实就是JavaScript向服务器发送Ajax请求,然后获取新数据,解析,渲染到网页上。
因此,我们知道真正的数据实际上是通过一次又一次的ajax请求获取的。如果要抓取这些数据,就需要知道请求是如何发送的,发送到哪里,以及发送了哪些参数。如果我们知道这一点,我们可以用Python模拟发送操作并得到结果吗?
我们来看看哪里可以看到这些后台Ajax操作,它们是如何发送的,以及发送了什么参数。
Ajax分析方法
以之前的youtube为例。我们知道拖拽刷新的内容是ajax加载的,页面的url没有变化,那么这些ajax请求应该去哪里找呢?
1.查看请求
这里还需要用到浏览器的开发者工具,下面以chrome浏览器为例介绍。
一、用chrome浏览器打开youutue的链接
按F12切换到Network选项卡,然后按F5再次刷新页面,你会发现这里有很多条目。如下所示:
前面说过,这其实就是页面加载过程中浏览器和服务器之间发送请求和接收响应的所有记录。
Ajax 实际上有其特殊的请求类型,称为 xhr。如下图所示,我们可以找到一个名称以getIndex开头,Type为xhr的请求,这是一个Ajax请求。
可以在右侧观察其请求头、URL 和响应头等信息。请求标头中的信息之一是