页面先于图片返回，爬取WP-Rocket站点图片遇技术问题求助

问题原因 #

WP-Rocket这类性能优化插件会对图片做懒加载处理——页面初始HTML仅包含图片占位符，真实图片地址要靠JavaScript在浏览器加载过程中动态注入。而你用的requests库只能获取静态初始HTML，无法执行页面JS，自然拿不到加载完成后的图片内容。

解决方案 #

1. 使用支持JS渲染的工具（推荐）

用Selenium或Playwright模拟真实浏览器行为，等待页面完全加载（包括图片）后再获取内容：

Selenium示例代码：

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

# 配置Chrome浏览器
options = webdriver.ChromeOptions()
options.add_argument("user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.5112.102 Safari/537.36")
options.add_argument("--headless=new")  # 无头模式，不显示浏览器窗口

driver = webdriver.Chrome(options=options)
link = 'https://swatmanga.me/1369130/my-school-life-pretending-to-be-a-worthless-person-04/'

try:
    driver.get(link)
    # 等待所有图片元素加载完成
    WebDriverWait(driver, 10).until(
        EC.presence_of_all_elements_located((By.TAG_NAME, "img"))
    )
    # 获取完整页面源码
    page_source = driver.page_source
    print(page_source)
finally:
    driver.quit()

Playwright示例代码：

from playwright.sync_api import sync_playwright

link = 'https://swatmanga.me/1369130/my-school-life-pretending-to-be-a-worthless-person-04/'

with sync_playwright() as p:
    browser = p.chromium.launch(headless=True)
    page = browser.new_page(user_agent="Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.5112.102 Safari/537.36")
    page.goto(link, wait_until="networkidle")  # 等待网络空闲，确保资源加载完成
    page_source = page.content()
    print(page_source)
    browser.close()

2. 手动抓取图片API接口（进阶）

打开浏览器开发者工具（F12）的网络面板，刷新页面后过滤img或XHR请求，找到图片的真实请求地址。这类网站通常会通过接口动态返回图片列表，直接请求这些接口就能拿到图片地址，无需渲染页面。

3. 调整请求头参数

移除if-modified-since头，这个头会让服务器返回缓存的旧页面，可能导致内容不完整：

headers = {
    'accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8',
    'accept-encoding': 'gzip, deflate, br',
    'accept-language': 'en-US,en;q=0.9',
    'referer': 'https://swatmanga.me/1369130/my-school-life-pretending-to-be-a-worthless-person-04/',
    'sec-fetch-dest': 'document',
    'sec-fetch-mode': 'navigate',
    'sec-fetch-site': 'same-origin',
    'sec-fetch-user': '?1',
    'sec-gpc': '1',
    'upgrade-insecure-requests': '1',
    'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.5112.102 Safari/537.36'
}

注意事项 #

• 频繁爬取可能触发反爬机制，建议添加请求间隔（time.sleep()），避免被封禁。
• 遵守网站robots.txt协议和使用条款，不要进行恶意爬取。

内容的提问来源于stack exchange，提问作者Conan Edegawa