1、Network

1-1、什么是 Network

Network 的功能是：记录在当前页面上发生的所有请求。Network记录的是实时网络请求。现在网页都已经加载完成，所以不会有东西。（刷新后可弹出）

• 【windows】：在网页的空白处点击右键，然后选择“检查”（快捷方式是ctrl+shift+i），再在 Elements 页面按 ctrl+f；
• 【mac】：在网页的空白处点击右键，然后选择“检查”（快捷键 command + option + I(大写i)）；

image.png

1-2、Network 怎么用

image.png

• 第1行，是对请求进行分类查看。我们最常用的是：ALL（查看全部）/XHR（仅查看XHR，我们等会重点讲它）/Doc（Document，第0个请求一般在这里），有时候也会看看：Img（仅查看图片）/Media（仅查看媒体文件）/Other（其他）。最后，JS和CSS，则是前端代码，负责发起请求和页面实现；Font是文字的字体；而理解WS和Manifest，需要网络编程的知识。

image.png

• 夹在第2行和第1行中间的，是一个时间轴。记录什么时间，有哪些请求。而第2行，就是各个请求，你可以看下面这张表来理解（读，但不需要记忆）。

image.png

• 第3行，是个统计：有多少个请求，一共多大，花了多长时间。

2、XHR

2-1、什么是 XHR

在Network中，有一类非常重要的请求叫做XHR（当你把鼠标在XHR上悬停，你可以看到它的完整表述是XHR and Fetch）。Ajax技术工作的时候，会创建一个XHR（或是Fetch）对象，实现服务器和浏览器之间传输数据。

2-2、XHR 怎么请求

蓝框里面的内容，从左往右分别是：Headers：标头（请求信息）、Preview：预览、Response：原始信息、Timing：时间。

image.png

在Network，有非常重要的一类请求是XHR（或Fetch），因为有它的存在，人们不必刷新/跳转网页，即可加载新的内容。随着技术发展，XHR的应用频率越来越高，我们常常需要在这里找我们想要的数据。

XHR的功能是传输数据，其中有非常重要的一种数据是用json格式写成的，和html一样，这种数据能够有组织地存储大量内容。json的数据类型是“文本”，在Python语言当中，我们把它称为字符串。我们能够非常轻易地将json格式的数据转化为列表/字典，也能将列表/字典转为json格式的数据。

3、json

3-1、json 是什么？

Python语言当中，json是一种特殊的字符串，这种字符串特殊在它的写法——它是用列表/字典的语法写成的。我们可以将json格式的数据转化为列表/字典，也能将列表/字典转为json格式的数据。

a = '1,2,3,4'

# 这是字符串

b = [1,2,3,4]

# 这是列表

c = '[1,2,3,4]'

# 这是字符串，但它是用json格式写的字符串

3-2、json 数据如何解析？

image.png

而如果你想在Python语言中，实现列表/字典转json，json转列表/字典，则需要借助json模块。json模块不在我们的教学范围之内，所以不做展开。你可阅读它的官方文档来了解，地址在这里：https://docs.python.org/3/library/json.html

import json

a = [1,2,3,4]

b = json.dumps(a)     # 使用dumps()函数，将列表a转换为json格式的字符串，赋值给b。
print(b)   
#[1, 2, 3, 4]
print(type(b))  
#<class 'str'>
c = json.loads(b)   # 使用loads()函数，将json格式的字符串b转为列表，赋值给c。
print(c)
# [1, 2, 3, 4]
print(type(c))
# <class 'list'>

4、项目：寻找周杰伦

4-1、确定目标

（1）目标网站：https://y.qq.com/；

（2）网站协议：https://y.qq.com/robots.txt（目标网站 + robots.txt 可查看目标网站的页面爬取许可）；

（3）项目目标：爬取周杰伦的歌曲。

4-2、过程分析

（1）确定数据位置

image.png

import requests

from bs4 import BeautifulSoup

res_music = requests.get('https://y.qq.com/portal/search.html#page=1&searchid=1&remoteplace=txt.yqq.top&t=song&w=%E5%91%A8%E6%9D%B0%E4%BC%A6')

# 请求html，得到response

bs_music = BeautifulSoup(res_music.text,'html.parser')

# 解析html

list_music = bs_music.find_all('a',class_='js_song')

# 查找class属性值为“js_song”的a标签，得到一个由标签组成的列表

print(list_music)

# 打印它

结果为空，打印源代码后发现歌曲名不存在与 html 页面。

（2）XHR 中查找请求文件

image.png

（3）数据在 client_search_cp?... 请求文件 ['data']['song']['list'] 中

image.png

4-3、代码实现

4-3-1、获取请求地址

image.png

import requests

# 引用requests库

res_music = requests.get('https://c.y.qq.com/soso/fcgi-bin/client_search_cp?ct=24&qqmusic_ver=1298&new_json=1&remoteplace=txt.yqq.song&searchid=60997426243444153&t=0&aggr=1&cr=1&catZhida=1&lossless=0&flag_qc=0&p=1&n=20&w=%E5%91%A8%E6%9D%B0%E4%BC%A6&g_tk=5381&loginUin=0&hostUin=0&format=json&inCharset=utf8&outCharset=utf-8&notice=0&platform=yqq.json&needNewCode=0')

# 调用get方法，下载这个字典

4-3-2、解析数据

json() 将获取到的 Response 对象转换为字典，再根据歌曲名的位置，我们用字典取值的方式找到页面上的歌曲名信息。

import requests

# 引用requests库

res_music = requests.get('https://c.y.qq.com/soso/fcgi-bin/client_search_cp?ct=24&qqmusic_ver=1298&new_json=1&remoteplace=txt.yqq.song&searchid=60997426243444153&t=0&aggr=1&cr=1&catZhida=1&lossless=0&flag_qc=0&p=1&n=20&w=%E5%91%A8%E6%9D%B0%E4%BC%A6&g_tk=5381&loginUin=0&hostUin=0&format=json&inCharset=utf8&outCharset=utf-8&notice=0&platform=yqq.json&needNewCode=0')

# 调用get方法，下载这个字典

json_music = res_music.json()

# 使用json()方法，将response对象，转为列表/字典

list_music = json_music['data']['song']['list']

# 一层一层地取字典，获取歌单列表

for music in list_music:

# list_music是一个列表，music是它里面的元素

 print(music['name'])

 # 以name为键，查找歌曲名

4-3-3、下载歌曲名、所属专辑、播放时长，以及播放链接

就是这样一个代码，它能拿到周杰伦在QQ音乐上，前20个歌曲的名单。

事实上，如果对这个程序稍加延展，它就能拿到：歌曲名、所属专辑、播放时长，以及播放链接。因为这些信息都在那个XHR里，认真观察分析，如果有必要的话还可以配合翻译软件。最终，你可以用同样的方法把它们提取出来。就像这样：

import requests
# 引用requests库
res_music = requests.get('https://c.y.qq.com/soso/fcgi-bin/client_search_cp?ct=24&qqmusic_ver=1298&new_json=1&remoteplace=txt.yqq.song&searchid=60997426243444153&t=0&aggr=1&cr=1&catZhida=1&lossless=0&flag_qc=0&p=1&n=20&w=%E5%91%A8%E6%9D%B0%E4%BC%A6&g_tk=5381&loginUin=0&hostUin=0&format=json&inCharset=utf8&outCharset=utf-8&notice=0&platform=yqq.json&needNewCode=0')
# 调用get方法，下载这个字典
json_music = res_music.json()
# 使用json()方法，将response对象，转为列表/字典
list_music = json_music['data']['song']['list']
# 一层一层地取字典，获取歌单列表
for music in list_music:
# list_music是一个列表，music是它里面的元素
    print(music['name'])
    # 以name为键，查找歌曲名
    print('所属专辑：'+music['album']['name'])
    # 查找专辑名
    print('播放时长：'+str(music['interval'])+'秒')
    # 查找播放时长
    print('播放链接：https://y.qq.com/n/yqq/song/'+music['mid']+'.html\n\n')
    # 查找播放链接