【爬虫】5. Ajax数据爬取

本文详细介绍了Ajax数据爬取的概念、基本原理,以及如何通过分析网络请求和响应来识别Ajax加载的数据。提供了使用requests库在实战中抓取Ajax数据的步骤和一个具体示例,包括分析页面加载逻辑和编写Python脚本来实现数据抓取。

Ajax数据爬取

有时候我们用requests抓取页面得到的结果,可能和在浏览器中看到的不一样:在浏览器中可以看到正常显示的页面数据,而使用requests得到的结果中并没有这些数据。这是因为requests获取的都是原始的HTML文档,而浏览器中的页面是JavaScript处理数据后生成的记过,这些数据有多种来源:可能是通过Ajax加载的,可能是包含在HTML文档中的,也可能是经过JavaScript和特定算法计算后生成的。

对于第一种来源——Ajax加载。数据加载时一种异步加载方式,原始页面最初不会包含某些数据,党员是页面加载完后,会再向服务器请求某个接口来获取数据,然后数据才会经过处理从而呈现在网页上,这其实时发送了一个Ajax请求。按照目前的发展形式,这种页面越来越多,数据都是通过Ajax统一加载后呈现出来的,这样使得Web开发做到前后端分离,减少服务器直接渲染带来的压力。

1. 什么是Ajax?

Ajax,全称为Asynchronous JavaScript and XML,即异步的JavaScript和XML。它不是一门编程语言,而是利用JavaScript在保证页面不被刷新、页面链接不改变的情况下与服务器交换数据并更新部分网页内容的技术。 想象一下你正在一个在线购物网站上浏览商品列表,突然你想要查看某个商品的详细信息。如果没有Ajax,你点击该商品,整个页面都会重新加载,你需要重新浏览商品列表,然后再找到你之前看到的位置。但是,如果使用了Ajax,当你点击商品时,只会请求获取这个商品的信息,然后将它显示在当前页面,而不会刷新整个页面。 在浏览一些网页时候,我们会发现很多网页都有“下滑查看更多”的选项,这个下滑而出现新内容的过程其实就是Ajax加载的过程。换句话说,Ajax让网页能够在不打断你的浏览的情况下,与服务器进行数据交换,使用户体验更加流畅和快速。这有助于创建更具动态性的网页,而不是每次都要刷新整个页面。

2. 基本原理

当你打开一个网页并与服务器进行交互时,通常是通过HTTP请求来获取或发送数据。传统的方式是在浏览器中点击链接或提交表单时,整个页面会重新加载,这会导致用户体验不流畅。

Ajax的基本原理是利用JavaScript来在后台发送HTTP请求,然后使用这些请求来更新页面的一部分内容,而不需要重新加载整个页面。这使得用户可以在不中断他们的操作的情况下获取或发送数据。

下面是Ajax的基本步骤:

  1. 触发事件: 通常是用户与页面上的元素进行交互,比如点击按钮、填写表单等。这个事件会触发JavaScript代码的执行。

  2. 创建XMLHttpRequest对象: JavaScript代码会创建一个XMLHttpRequest对象,这个对象允许浏览器与服务器进行通信,发送和接收数据。

  3. 发送请求: 使用XMLHttpRequest对象,JavaScript会发送HTTP请求到服务器。这个请求可以是GET请求(用于获取数据)或POST请求(用于发送数据)。

  4. 与服务器通信: 服务器收到请求后,会处理请求并返回相应的数据,通常以JSON、XML或HTML等格式。

  5. 更新页面: 一旦浏览器收到来自服务器的响应,JavaScript代码会解析响应数据,并将其用于更新页面的特定部分,而不是整个页面。

这可以归类于三个过程:发送请求、解析内容、渲染网页。

3. Ajax分析方法

分析样例:首先,我们用Chrome打开https://weibo.com/,然后在页面中点击鼠标右键,从弹出的菜单中选择“检查”工具进入开发者工具,接着选择Network面板如下图所示:

在这里插入图片描述

这里展示的是页面的加载过程中,浏览器和服务器之间发送请求和接收响应的所有记录。事实上,Ajax有特殊的请求类型,叫做xhr,在上图中,我们可以发现有一行请求的Type是xhr,意味着这是一个Ajax请求。

点击这个请求,可以查看里面的信息,其中Request Headers中有一个信息为X-Requested-With:XMLHttpRequest,这就标记了此请求是Ajax请求。

随后点击一下Preview,就能看到响应的内容,如下图所示,这些内容是JSON格式的,这里Chrome为我们自动做了解析:

在这里插入图片描述

JavaScript接收到这些诗句时候,再执行相应的渲染方法,整个页面就渲染出来了

另外,也可以切换到Response选项卡,从中观察真实的返回数据,如下图所示:

在这里插入图片描述

所以说,微博界面呈现给我们的真实数据并不是最原始的页面返回的,而是执行JavaScript后向后台发送Ajax请求,浏览器拿到服务器返回的数据后进一步渲染得到的。

4. Ajax分析和爬取实战

4.1. 准备工作

  • 安装好Python3(最低为3.6)版本,并成功运行Python程序。
  • 了解并掌握Python HTTP请求库的基本用法。
  • 了解Ajax基础知识和分析Ajax的基本用法

4.2. 爬取目标

我们以一个示例网站来实战一下:https://spa1.scrape.center/, 该示例网站的数据请求时通过Ajax完成的,页面内容时通过JavaScript渲染出来的,我们需要分析页面的加载逻辑,用requests实现Ajax数据的爬取,将每一部电影分别保存到JSON文件中。

4.3. 分析页面的加载逻辑

我们先用requests直接提取页面,看看是怎么样的结果:

import requests
url = "https://spa1.scrape.center/"
response = requests.get(url)
print(response.text)
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/favicon.ico><title>Scrape | Movie
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

金渐层大战哥斯拉

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值