本教程旨在解决Dermnet等采用JavaScript动态加载图片的网站抓取难题。当传统方法如BeautifulSoup或Selenium受阻时，我们将展示如何通过
浏览器
开发者工具识别并直接调用隐藏的Google自定义搜索API（CSE）。通过分析API请求参数并解析返回的JSON数据，本指南提供了一种高效、稳定的图片抓取策略，并涵盖了分页处理和实践中的注意事项。
理解动态加载的挑战
在进行网页数据抓取时，我们经常会遇到内容通过
java
script动态加载的网站。这类网站在初始
html
响应中可能不包含所需的图片链接或数据，而是通过客户端脚本在页面加载完成后异步请求数据并渲染。对于这类场景，仅仅使用requests库获取html并结合beautifulsoup解析静态内容往往会失败，因为beautifulsoup无法执行
javascript
。虽然selenium等自动化测试工具可以模拟浏览器行为，执行javascript并等待内容加载，但其资源消耗较大，且在某些复杂场景下（如本案例中内容来自第三方api）仍然可能难以直接定位到渲染后的元素。
识别隐藏的API调用
解决动态加载问题的关键在于“透过现象看本质”，即找出页面数据实际的来源。许多动态加载的内容并非直接嵌入在JavaScript代码中，而是通过JavaScript向后端API发送请求获取。我们可以利用浏览器的开发者工具来发现这些隐藏的API调用。
打开开发者工具：
在目标网站（例如Dermnet的搜索结果页）上，按下F12键（或右键点击页面选择“检查”/“Inspect”）打开开发者工具。
切换到“网络”（Network）标签页：
这个标签页会显示浏览器在加载页面时发出的所有HTTP请求。
过滤和观察：
刷新页面，并仔细观察网络请求。通常，动态加载的数据请求会以XHR（XMLHttpRequest）或Fetch的形式出现。在本案例中，我们可以观察到有针对cse.google.com的请求。这类请求往往是Google自定义搜索（Google Custom Search Engine, CSE）的API调用。
分析API请求：
找到类似https://cse.google.com/cse/element/v1?rsz=large&num=16&hl=en&source=gcsc&gss=.com&cselibv=...&searchtype=image&cx=...&q=...&safe=off&cse_tok=...&exp=csqr,cc,bf&callback=google.search.cse.api...的URL。这个URL就是获取图片数据的API接口。点击该请求，查看其“响应”（Response）标签页，你会发现返回的是一个JSON对象，其中包含results字段，里面就是我们需要的图片信息。
构建API请求与解析响应
一旦识别出API接口，我们就可以绕过
前端
渲染，直接向该API发送请求并解析其JSON响应。
1. API URL参数分析
上述API URL包含多个关键参数，理解它们对于构建请求至关重要：
Comet AI 浏览器
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
下载
q: 搜索关键词（例如basal%20cell%20carcinoma%20dermoscopy）。
cx: Google CSE的自定义ID，用于标识特定的搜索引擎。
num: 每页返回结果的数量。
start: 控制分页，表示从第几个结果开始返回。
cse_tok: 一个动态生成的令牌（token），可能是用于身份验证或防止滥用。这个参数需要特别注意，它可能会随时间或请求而变化。
cselibv: 可能是一个版本号或动态生成的标识符，也建议从实际的网络请求中获取最新值。
callback: 通常用于JSONP请求，指定回调函数名。在直接请求纯JSON时，通常可以忽略或移除。
2. 使用Python发送API请求
我们可以使用Python的requests库来模拟这些API请求。
import requests
import json
import re
import time
import os
from urllib.parse import urlparse
def fetch_dermnet_images_via_api(query, max_pages=3, delay_seconds=1):
"""
通过Google CSE API抓取Dermnet的图片链接。
注意：cse_tok和cselibv参数可能需要动态获取或定期更新。
"""
base_api_url = "https://cse.google.com/cse/element/v1"
# 从浏览器开发者工具中获取的关键参数。
# cse_tok和cselibv通常是动态的，这里使用示例值，实际应用中可能需要更复杂的策略来获取。
# cx是Google CSE的ID，通常是固定的。
params = {
"rsz": "large",
"num": "16", # 每页图片数量
"hl": "en",
"source": "gcsc",
"gss": ".com",
"cselibv": "8e77c7877b8339e2", # 示例值，请从网络请求中获取最新
"searchtype": "image",
"cx": "015036873904746004277:nz7deehiccq", # Dermnet的CSE ID
"q": query,
"safe": "off",
"cse_tok": "AFW0emwRaupmNcwPmPDnZm7vKaJV:1684998350721", # 示例token，请从网络请求中获取最新
"exp": "csqr,cc,bf",
# "callback": "google.search.cse.api10440" # 如果直接请求JSON，可以不带callback参数
}
all_image_urls = []
for page in range(1, max_pages + 1):
print(f"Fetching page {page} for query: '{query}'")
# Google CSE API通过start参数控制分页，start表示从第几个结果开始
params["start"] = (page - 1) * int(params["num"]) + 1
try:
# 移除callback参数以获取纯JSON响应，如果存在的话
temp_params = params.copy()
if "callback" in temp_params:
del temp_params["callback"]
# 模拟浏览器User-Agent
headers = {
"User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124124 Safari/537.36"
}
response = requests.get(base_api_url, params=temp_params, headers=headers, timeout=15)
response.raise_for_status() # 检查HTTP请求是否成功
# Google CSE API返回的响应通常是JSONP格式，即以函数调用