使用BeautifulSoup爬取USCIS表格得占位符，如何获取真实内容？

问题原因 #

这个页面采用Vue框架开发，初始HTML仅包含模板占位符（如${data.FORM_NAME}），真实表格数据是浏览器加载页面后，通过JavaScript请求后端API获取并渲染到页面上的。requests直接请求只能拿到未渲染的初始模板，因此无法获取真实数据。

解决方案 #

方案1：直接调用后端API（推荐，高效）

浏览器会在页面加载时发送请求获取数据，我们可以直接找到这个API接口，跳过页面渲染环节：

1. 打开浏览器F12开发者工具，切换到Network标签，刷新页面；
2. 筛选XHR/Fetch类型的请求，找到返回表格数据的接口（通常返回JSON格式）；
3. 用requests请求该接口，将JSON数据转换为DataFrame。

代码示例：

import requests
import pandas as pd

# 替换为你找到的实际API接口地址
api_url = "https://egov.uscis.gov/processing-times/api/historic-processing-times"
resp = requests.get(api_url)
data = resp.json()

# 提取表格数据并整理成DataFrame
df = pd.DataFrame(data["histFormsData"])
# 调整列名和顺序匹配页面表格
df = df[[
    "FORM_NAME", "FORM_TITLE_EN", "FORM_DESC_EN",
    "FY14", "FY15", "FY16", "FY17", "NAT_AVG_MONTHS", "FY22"
]]
df.columns = [
    "Form", "Form Description", "Classification or Basis for Filing",
    "FY 2014", "FY 2015", "FY 2016", "FY 2017", "FY 2021", "FY 2022"
]
print(df)

方案2：用Selenium模拟浏览器渲染页面

如果找不到API接口，可以用Selenium启动真实浏览器，等待页面完全渲染后再爬取：

1. 安装依赖：pip install selenium，并下载对应浏览器的驱动（如ChromeDriver，需与浏览器版本匹配）；
2. 用Selenium打开页面，等待表格加载完成后获取渲染后的HTML；
3. 用pandas解析HTML中的表格。

代码示例：

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

# 初始化Chrome浏览器（确保ChromeDriver路径正确，或已加入环境变量）
driver = webdriver.Chrome()
driver.get("https://egov.uscis.gov/processing-times/historic-pt")

# 等待表格主体加载完成，超时时间10秒
wait = WebDriverWait(driver, 10)
wait.until(EC.presence_of_element_located((By.CLASS_NAME, "recordsBody")))

# 获取渲染后的页面源码
html = driver.page_source

# 解析表格
df = pd.read_html(html, attrs={"class": "records"})[0]
print(df)

# 关闭浏览器
driver.quit()

新手提示 #

• 优先选择API方案，速度更快、资源消耗更低；
• 使用Selenium时，注意浏览器驱动与浏览器版本必须匹配，否则会报错；
• 查看Network请求时，可通过请求的响应内容快速定位到返回表格数据的接口。

内容的提问来源于stack exchange，提问作者Christian Sánche