如何使用 Beautiful Soup 从网站上抓取 SVG 元素？

Question

from bs4 import BeautifulSoup
import requests
import random

id_url = "https://codeforces.com/profile/akash77"
id_headers = {
    "User-Agent": 'Mozilla/5.0(Windows NT 6.1Win64x64) AppleWebKit / 537.36(KHTML, like Gecko) Chrome / 87.0 .4280 .141 Safari / 537.36 '}
id_page = requests.get(id_url, headers=id_headers)
id_soup = BeautifulSoup(id_page.content, 'html.parser')

id_soup = id_soup.find('svg')
print(id_soup)

我得到

None

作为其输出。

如果我解析包含此

<div>

标签的

<svg>

元素，则不会打印

<div>

元素的内容。

find()

适用于除 SVG 标签之外的所有 HTML 标签。

Answer 1

网页是使用 Javascript 动态渲染的，因此您需要 selenium 来获取渲染的页面。

首先，安装库

pip install selenium
pip install webdriver-manager

然后，您就可以使用它来访问整个页面了

from selenium import webdriver
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.common.by import By

s=Service(ChromeDriverManager().install())
driver = webdriver.Chrome(service=s)
driver.maximize_window()
driver.get('https://codeforces.com/profile/akash77')
elements = driver.find_elements(By.XPATH, '//*[@id="userActivityGraph"]')

Elements 是一个 selenium WebElement，因此我们需要从中获取 HTML。

svg = [WebElement.get_attribute('innerHTML') for WebElement in elements]

这将为您提供 svg 及其中的所有元素。

有时，您需要在无头模式下运行浏览器（无需打开 chrome UI），为此您可以将“无头”选项传递给驱动程序。

from selenium.webdriver.chrome.options import Options

options = Options()
options.add_argument('headless')

# then pass options to the driver

driver = webdriver.Chrome(service=s, options=options) 

Answer 2

svg 标签不包含在源代码中，它是由 Javascript 渲染的。

Answer 3

如果您只想要 html 中的数据，这不太漂亮，但它可以工作，并且比浏览器自动化更快更容易：

import requests
import json

url = 'https://codeforces.com/profile/akash77'

resp = requests.get(url)

start = "$('#userActivityGraph').empty().calendar_yearview_blocks("
end = "start_monday: false"

s = resp.text
svg_data = s[s.find(start)+len(start):s.rfind(end)].strip()[:-1].replace('items','"items"').replace('data','"data"').replace('\n','').replace('\t','').replace(' ','') #get the token out the html
broken = svg_data+'}'

json_data = json.loads(broken)
print(json_data)

Answer 4

迟到的答案，但请尝试

id_soup = id_soup.find('svg:svg')
print(id_soup)

SVG 是一种 XML 方言，因此 Beautiful Soup 会使用命名空间的名称来注释标签名称。