python - 网页抓取中的问题

Question

我正在尝试在PyCharm中编写一个程序(我以前没有使用过这个IDE，但我不认为这是问题所在)我遇到了从某个类收集数据时遇到麻烦，“react-contextmenu-wrapper”

我想编写一个脚本来解析 Spotify 上的网页并使用数据创建一个 CSV 文件，我一直在关注 YouTube 上的教程，但我一定是在某个地方出错了。

这是我的代码:

from urllib.request import urlopen as Req
from bs4 import BeautifulSoup as soup

my_url = "https://open.spotify.com/genre/NMF-PopularNewReleases"

#grabs the contense of the page
Client = Req(my_url)

#reads the contense of the page
html = Client.read()

#outputs the page
Client.close()

page = soup(html, "html.parser")

#grabs each playlist
playlists = page.findAll("div",{"class":"react-contextmenu-wrapper"})

print(len(playlists))

但是终端输出一个空列表，我知道该类存在。当我检查页面元素时我可以看到它。

Answer 1

元素的类名为 react-contextmenu-wrapper 的事实是一个很大的暗示。 React 是一个用于创建用户界面的 JavaScript 库。

可以通过多种不同的方式向网页填充元素。如果你幸运的话，服务器会向你发送一个 .html，其中包含基本上已包含的所有内容 - 这对于使用 BeautifulSoup 进行抓取和解析来说是微不足道的。

然而，许多现代网站都动态填充网页的元素，例如使用 JavaScript。当您在浏览器中查看这样的页面时，这没有问题 - 但如果您尝试抓取这样的页面，您最终只会得到“裸露的骨头”模板 .html，其中DOM 尚未完全填充。这就是为什么 BeautifulSoup 看不到这个元素的原因。

重点是:仅仅因为您可以在浏览器中看到某个元素，并不意味着 BeautifulSoup 也能够看到它。

在我看来，每当你想抓取网页时，你的首选武器不应该是 BeautifulSoup - 你应该使用 BeautifulSoup 作为最后的手段。您应该做的第一件事就是检查您正在抓取的页面是否向 API 发出任何请求，并使用 API 的响应来填充自身。如果是这样，您可以简单地模仿对同一 API 的请求，并获取您想要抓取的所有内容。好像这还不够好，这些 API 通常提供 JSON，解析起来很简单。

具体操作方法如下:

1. 在浏览器中打开网页。
2. 如果您使用的是 Google Chrome，请按 F12 键访问 开发者工具(其他现代浏览器应该有类似的 功能。)
3. 打开“网络”选项卡。我们将使用Chrome的网络记录器来记录 该网页发出的所有请求。
4. 点击漏斗形图标(激活后会变成红色) 启用过滤。
5. 单击 XHR(这意味着仅查看 XMLHttpRequest。这些是 我们感兴趣的请求类型，因为我们想看到 对 API 的潜在传出请求 - 我们对捕获对图像等资源发出的请求不感兴趣)
6. 按 Ctrl + E 或点击左上角的圆形录制按钮 启用日志记录(激活时此选项也会变成红色。)
7. 按 Ctrl + R 刷新页面并开始记录流量。
8. 您应该会看到请求列表随着页面加载而不断增长 清爽。它看起来像这样(对不起，大 图片):
9. 就我而言，Spotify 在此期间提出了 9 个 XHR 请求(左侧) 我记录流量的时间。我点击了其中的一些，然后 检查了他们的“标题”选项卡，直到我找到一个带有“请求”的选项卡 URL”看起来像是在与 API 对话(“api”是 本例中为 URL。)

是时候使用请求编写一个简单的脚本了。你会想要复制 “请求 URL”，并确保复制一些“请求 header ” 看起来它们对于请求也可能很重要:

import requests

url = "https://api.spotify.com/v1/views/NMF-PopularNewReleases?timestamp=2020-03-22T14%3A26%3A36.760Z&platform=web&content_limit=10&limit=20&types=album%2Cplaylist%2Cartist%2Cshow%2Cstation&image_style=gradient_overlay&country=us&market=us&locale=en"

headers = {
    "Authorization": "Bearer BQDJeAA33JWAC_pQVUxoPpama63RFFIsovMjNOjq_odaPx9EfyMz1Bo494Xv4a20H9gM7Hu0OYZrO3QWs2E"
}

response = requests.get(url, headers=headers)
response.raise_for_status()

data = response.json()

for item in data["content"]["items"]:
    print(item["name"])

当我运行此脚本时，我得到以下输出:

New Music Friday
After Hours
Colores
kelsea
Actions
Kid Krow
Walk Em Down (feat. Roddy Ricch)
Studio It’s Hits
Intentions (Acoustic)
Creep
Is Everybody Going Crazy?
2 Seater (feat. G-Eazy & Offset)
Roses/Lotus/Violet/Iris
Spotify Singles
Between Us (feat. Snoh Aalegra)
E.P.
Black Men Don’t Cheat (feat. Ari Lennox, 6LACK & Tink)
Think About You
Pray 4 Love
Acrobats
>>> 

随意检查 API 返回的 JSON 对象 - 您可以在 Python 中执行此操作，也可以通过从 Chrome 开发人员工具中的“ header ”选项卡切换到“预览”选项卡来查看 JSON 的内容。在我的示例中，我只是提取了首页上歌曲的标题，但 JSON 对象包含一堆更有趣的内容。您还可以使用 URL 查询字符串中的参数来获取 20 多首歌曲等。