如何使用BeautifulSoup抓取Nike特卖页多配色商品的全部URL及相关信息

问题根因 #

你当前使用requests+BeautifulSoup的组合只能拉取页面初始静态HTML源码，Nike多配色商品的其余配色URL并未预置在初始DOM中，需要鼠标悬浮触发前端JS逻辑才会更新商品卡片的链接属性，因此静态解析无法拿到全量数据。

可行采集方案 #

方案1：动态浏览器模拟（逻辑简单兼容性强） #

使用Selenium/Playwright等自动化工具模拟浏览器操作，主动触发hover事件获取所有配色对应的链接，示例代码如下：

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.by import By
import time

# 初始化Chrome浏览器，需提前配置对应版本的ChromeDriver
driver = webdriver.Chrome()
driver.get("https://www.nike.com/w/sale-3yaep")
# 等待页面资源加载完成
time.sleep(3)

all_links = set()
# 遍历所有商品卡片
for prod_card in driver.find_elements(By.CLASS_NAME, "product-card__body"):
    # 先收录默认配色链接
    default_link = prod_card.find_element(By.TAG_NAME, "a").get_attribute("href")
    all_links.add(default_link)
    # 获取当前卡片下所有配色色块
    color_tiles = prod_card.find_elements(By.CLASS_NAME, "colorway-item")
    for tile in color_tiles:
        # 模拟鼠标悬浮在色块上
        ActionChains(driver).move_to_element(tile).perform()
        time.sleep(0.2)
        # 读取更新后的商品链接
        updated_link = prod_card.find_element(By.TAG_NAME, "a").get_attribute("href")
        all_links.add(updated_link)

# 输出所有去重后的商品链接
for link in all_links:
    print(link)

driver.quit()

该方案无需分析页面数据结构，完全模拟用户操作，兼容官网后续的前端渲染逻辑调整，适合小规模采集使用。

方案2：解析静态页预存JSON（效率更高） #

Nike页面加载时会把全量商品数据（包含所有配色的URL）预置在window.INITIAL_REDUX_STATE全局JS变量中，无需触发hover，直接正则提取解析即可，采集效率远高于动态浏览器方案，示例代码如下：

import requests
import re
import json

url = "https://www.nike.com/w/sale-3yaep"
# 配置正常浏览器UA避免被反爬拦截
headers = {
    "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36"
}
resp = requests.get(url, headers=headers, verify=False)
# 正则匹配全量商品数据
data_match = re.search(r'window\.INITIAL_REDUX_STATE\s*=\s*(.*?);\s*</script>', resp.text, re.S)
if data_match:
    prod_data = json.loads(data_match.group(1))
    all_links = set()
    # 遍历所有商品的所有配色提取链接
    for item in prod_data["Wall"]["products"]:
        for colorway in item["colorways"]:
            all_links.add(colorway["pdpUrl"])
    for link in all_links:
        print(link)

该方案仅需1次请求即可拿到全量数据，无需启动浏览器，适合大规模采集使用，若后续官网调整字段名称，重新核对源码字段即可正常使用。

注意事项 #

• 请求时需配置合理的请求头，控制请求频率，避免触发官网反爬策略
• 若官网更新前端结构，可重新检查静态源码对应字段或类名，调整匹配逻辑即可

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