当前位置： 移动技术网 > IT编程>开发语言>JavaScript > 【Python爬虫】—— Ajax 的原理和分析

【Python爬虫】—— Ajax 的原理和分析

2020年07月14日  | 移动技术网IT编程  | 我要评论

什么是 Ajax

Ajax，全称为 Asynchronous JavaScript and XML，即异步的 JavaScript 和 XML。它是一种利用 JavaScript 在保证页面不被刷新、页面链接不改变的情况下与服务器交换数据并更新部分网页的技术。

Ajax 的优点

对于传统的网页，如果想更新其内容则必须刷新整个页面。有了 Ajax，便可以在页面不被全部刷新的情况下更新其内容。在此过程中，页面实际上在后台与服务器进行了数据交互，获取到数据之后，再利用 JavaScript 改变网页，这样网页内容就会更新了。如果网页的原始 HTML 不包含任何数据，数据都是通过 Ajax 统一加载后再呈现出来的，这在 Web 开发上可以做到前后端分离，并且降低服务器直接渲染页面带来的压力，也可以有效防止爬虫。

尝试抓取 Ajax 加载的页面

在看到浏览器中正常显示的页面之后，尝试使用 requests 抓取页面时，得到的结果如果和在浏览器中看到的不一样，可能是因为 requests 获取的是原始 HTML 文档，而浏览器中的页面是经过 JavaScript 数据处理后生成的结果，这些数据的来源可能是通过 Ajax 加载的。

如何抓取 Ajax 加载的页面

对于 Ajax，数据加载是一种异步加载方式，原始页面不会包含某些数据，只有在加载完后，才会向服务器请求某个接口获取数据，然后数据才被处理从而呈现到网页上，这个过程实际上就是向服务器接口发送了一个 Ajax 请求。此时我们需要分析网页后台向接口发送的 Ajax 请求，用 requests 来模拟 Ajax 请求，就可以成功抓取页面了。

Ajax 基本原理

发送 Ajax 请求到网页更新的过程可以简单分为以下 3 步：

  1. 发送请求
  2. 解析内容
  3. 渲染网页

这 3 个步骤其实都是由 JavaScript 完成的。

Ajax 分析

下面以豆瓣电影为例，我们进入电影分类页面：

下拉到页面底部，我们可以看到 加载更多 的按钮：

点击 加载更多 之后，加载了一些新的电影，而页面的 URL 并没有发生改变：

如何查看 Ajax 请求

要想查看 Ajax 请求，我们可以借助 Chrome 的开发者工具，借助它可以看到页面加载过程中浏览器与服务器之间发送请求和接收响应的所有记录。

Ajax 有其特殊的请求类型，它叫作 XHR（XMLHttpRequest）。

点击 加载更多 后，可以发现一个新的请求，其 Type 为 xhr，这就是一个 Ajax 请求。
在这里插入图片描述
用鼠标点击这个请求，可以查看这个请求的详细信息：
在这里插入图片描述
在右侧我们可以观察到 Request Headers、URL 和 Response Headers 等信息。

点击 Preview，即可看到响应的内容，它是 JSON 格式的。此处 Chrome 自动做了解析，点击箭头即可展开和收起相应内容：

在这里插入图片描述

JavaScript 接收到这些数据之后，再执行相应的渲染方法，整个页面就渲染出来了。

另外，我们也可以切换到 Response 选项卡，从中观察到真实的返回数据：
在这里插入图片描述

接下来，切回到第一个请求，观察一下它的 Response：
在这里插入图片描述

这就是最原始 URL 返回的结果，其代码结构也非常简单，只是执行了一些 JavaScript。

因此，我们看到的页面的真实数据并不是最原始的页面返回的，而是在执行 JavaScript 后再次向后台发送 Ajax 请求，浏览器拿到数据后进一步渲染出来的。

如何模拟 Ajax 请求

利用 Chrome 开发者工具的筛选功能筛选出所有的 Ajax 请求。在请求的上方有一层筛选栏，直接点击 XHR，此时在下方显示的所有请求都是 Ajax 请求，然后不断点击 加载更多，就能捕获所有的 Ajax请求了：
在这里插入图片描述
随意点开一个条目，都可以清楚地看到其 Request URL、Request Headers、Response Headers、Response Body 等内容，此时只需要用程序模拟这些 Ajax 请求，就可以轻松提取我们所需要的信息了。

Reference：https://kaiwu.lagou.com/course/courseInfo.htm?courseId=46#/detail/pc?id=1673

本文地址：https://blog.csdn.net/weixin_45961774/article/details/107298141

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网