1. 项目概述为什么我们需要拦截XHR来还原动态站API如果你写过爬虫尤其是针对现代单页面应用SPA或者那些数据全靠JavaScript异步加载的网站你一定遇到过这种场景打开网页数据刷刷地显示出来但一看网页源代码除了一个空壳子和一堆JS文件啥也没有。这就是典型的动态渲染站点它们的数据通常通过XHRXMLHttpRequest或Fetch API在后台与服务器通信获取。传统的requests库配合BeautifulSoup在这里就完全失效了因为你抓取到的HTML里根本没有数据。这时候无头浏览器Headless Browser就成了我们的利器。Playwright作为后起之秀以其跨浏览器支持、强大的API和出色的性能迅速在自动化测试和爬虫领域占据了一席之地。它不仅能模拟用户点击、滚动、输入等完整交互更重要的是它提供了监听和拦截网络请求的能力。这意味着我们不再需要费劲地去逆向解析复杂的JavaScript代码或者去猜测数据是从哪个接口来的。我们可以直接让Playwright在页面加载和运行过程中把所有发起的网络请求特别是XHR/Fetch都“抓”出来直接拿到最纯净的JSON数据接口。这个项目的核心价值就在于此化繁为简直击要害。我们不再与渲染后的DOM结构纠缠而是直接获取数据源头。这对于数据采集效率、代码稳定性以及应对反爬策略如频繁变化的DOM结构都有着革命性的提升。无论你是数据分析师需要定期抓取某资讯网站的最新列表还是开发者需要聚合多个平台的数据掌握这套方法都能让你事半功倍。2. 核心思路与工具选型为什么是Playwright在动态内容爬取领域我们有几个常见的选择Selenium、Puppeteer和Playwright。这里我选择Playwright并非盲目追新而是基于几个在实际项目中反复验证过的关键考量。2.1 与Selenium的对比更现代更强大Selenium是元老生态庞大但它的设计更偏向于WebDriver标准在复杂交互和网络控制上略显笨重。Playwright由微软团队开发原生支持Chromium、Firefox和WebKit三大浏览器引擎这意味着你写一套脚本可以无缝在三个浏览器上运行测试对于需要验证跨浏览器兼容性的爬虫场景有些网站会对特定浏览器做不同处理非常有用。更重要的是Playwright的API设计更现代化和人性化自动等待机制auto-waiting做得非常好你不需要写一大堆time.sleep或显式等待它会在元素可操作时自动执行动作大大减少了脚本的不稳定性。2.2 与Puppeteer的对比更全面更跨平台Puppeteer是Chrome团队的产品对Chromium系浏览器的支持是顶级的。但Playwright可以看作是它的“增强版”和“扩展版”。除了支持多浏览器引擎Playwright在网络拦截方面的API更灵活。例如page.route()方法可以非常方便地拦截和修改任何请求与响应这是我们本项目的基石。此外它在处理文件下载、模拟移动设备、录制操作等方面也提供了更强大的功能。2.3 网络拦截能力的深度解析Playwright的page.route()方法是我们的“杀手锏”。它允许我们在请求发出前request或响应返回后response介入。对于爬虫我们主要利用它在响应返回后将数据捕获下来。其工作原理是我们为特定的URL模式比如包含api或json的路径注册一个路由处理器。当页面中的JavaScript代码发起一个匹配该模式的XHR或Fetch请求时Playwright会拦截这个请求正常发送到服务器并获取响应但在响应返回给页面JS之前会先交给我们注册的回调函数处理。我们在这个回调函数里就能拿到原始的响应数据进行保存、分析或修改。注意这里有一个关键点我们通常选择拦截并记录响应而不是直接abort中止请求或fulfill用自定义响应完成。因为中止请求可能导致页面JS因拿不到数据而报错影响后续页面状态而直接完成请求需要我们手动构造所有响应数据对于复杂接口容易出错。记录模式是最稳妥的不影响页面正常渲染又能拿到数据。2.4 环境准备与基础安装工欲善其事必先利其器。开始之前确保你的Python环境是3.7及以上版本。安装Playwright非常简单pip install playwright安装完成后还需要安装浏览器驱动。Playwright很贴心地提供了一个命令行工具来完成这件事playwright install这条命令会下载Chromium、Firefox和WebKit的二进制文件。对于爬虫我们通常使用Chromium就够了因为它最通用性能也最好。如果你想只安装Chromium可以运行playwright install chromium。3. 实战第一步启动浏览器与基础页面导航让我们从一个最简单的例子开始目标是打开一个网页并监听所有的网络请求。这里我以一个模拟的动态数据网站例如http://quotes.toscrape.com/js/这个网站的名言数据是通过JS加载的作为示例但请记住实际应用中请务必遵守目标网站的robots.txt协议并合理控制请求频率。3.1 同步与异步模式的选择Playwright支持同步和异步两种API。对于爬虫脚本如果逻辑是线性的打开页面-拦截-抓取-关闭使用同步APIsync_playwright代码更简洁易懂。如果你的爬虫需要同时管理多个页面或执行复杂并发任务那么异步APIasync_playwright性能更好。本例中我们从同步模式开始。from playwright.sync_api import sync_playwright def intercept_xhr_demo(): with sync_playwright() as p: # 启动Chromium浏览器headlessFalse表示显示浏览器界面方便调试 browser p.chromium.launch(headlessFalse) # 创建一个新的浏览器上下文类似于一个独立的会话 context browser.new_context() # 打开一个新页面 page context.new_page() # 接下来我们将在这里添加网络监听代码 # 访问目标网址 page.goto(http://quotes.toscrape.com/js/) # 等待页面加载一段时间确保JS执行完毕。更好的做法是等待特定元素出现。 page.wait_for_timeout(3000) # 等待3秒实际开发中应使用 page.wait_for_selector # 获取页面最终渲染后的HTML虽然我们主要不靠这个 # html page.content() # print(html[:500]) # 打印前500字符看看 # 关闭浏览器 browser.close() if __name__ __main__: intercept_xhr_demo()运行这段代码你会看到一个浏览器窗口打开并访问了目标网页。现在页面上的名言数据已经通过JS加载出来了但我们的代码还没有捕获到加载数据的那个XHR请求。3.2 添加网络请求监听Playwright提供了page.on(request)和page.on(response)事件来监听所有请求和响应。但更精准的方式是使用我们之前提到的page.route()。我们先使用事件监听看看所有流量这有助于我们分析目标网站的数据接口特征。from playwright.sync_api import sync_playwright def intercept_xhr_demo(): with sync_playwright() as p: browser p.chromium.launch(headlessFalse) context browser.new_context() page context.new_page() # 监听所有响应完成的事件 def on_response(response): url response.url status response.status # 只打印包含‘api’或‘json’的请求避免输出太多噪音 if api in url or json in url or data in url: print(f 捕获到响应: {status} {url}) # 可以尝试打印响应头看看内容类型 # print(response.headers.get(content-type)) page.on(response, on_response) page.goto(http://quotes.toscrape.com/js/) page.wait_for_timeout(5000) # 多等一会儿让所有异步请求完成 browser.close()运行这个脚本你会在控制台看到一系列请求。对于quotes.toscrape.com/js/你可能会发现一个关键请求比如http://quotes.toscrape.com/api/quotes?page1这就是加载名言数据的XHR接口。这就是我们要拦截的目标。4. 核心环节使用page.route()精准拦截与数据提取事件监听帮我们找到了目标接口现在升级到更强大的page.route()进行精准拦截和数据提取。4.1 设置路由拦截器我们修改代码在页面goto之前设置路由。我们使用page.route()方法并传入一个URL匹配模式可以是字符串、正则表达式或函数和一个处理回调函数。from playwright.sync_api import sync_playwright import json def intercept_and_save(): captured_data [] # 用于存储捕获的数据 with sync_playwright() as p: browser p.chromium.launch(headlessTrue) # 生产环境用无头模式 context browser.new_context() page context.new_page() # 定义路由处理函数 def handle_route(route, request): # 只处理我们关心的请求 if api/quotes in request.url: # 继续发出这个请求 response route.continue_() # 但实际上route.continue_()是异步的在同步API中我们更常用的模式是 # 在page.route的回调里先continue然后在page.on(response)里处理。 # 为了直接拿到响应体我们采用另一种写法见下文。 pass # 使用通配符模式匹配所有请求在回调里过滤 page.route(**/*, handle_route) page.goto(http://quotes.toscrape.com/js/) page.wait_for_timeout(3000) browser.close() return captured_data上面的写法有个问题在handle_route里直接通过route.continue_()后我们拿不到响应体。正确的方法是结合page.route()和request.fulfill()或者更简单地在page.route的回调里continue然后通过监听response事件来处理。但Playwright提供了一个更优雅的方式在路由回调中我们可以先执行route.continue_()然后“等待”响应但这在同步API中有点别扭。4.2 推荐的拦截与捕获模式更清晰且强大的模式是在路由回调中我们不立即continue而是先“暂停”这个请求然后我们自己使用Playwright的API去发送一个相同的请求拿到响应后既保存数据又把这个响应“喂”给页面让页面正常渲染。from playwright.sync_api import sync_playwright import json def intercept_and_save(): captured_data [] with sync_playwright() as p: browser p.chromium.launch(headlessTrue) context browser.new_context() page context.new_page() # 关键使用 page.route 并搭配 route.fulfill async def handle_route(route): request route.request # 检查是否为目标API请求 if api/quotes in request.url: print(f拦截到目标请求: {request.url}) # 使用 fetch 获取原始响应这里需要异步上下文所以用另一种写法 # 对于同步API我们可以这样做 # 1. 获取请求的所有信息 method request.method url request.url headers request.headers post_data request.post_data # 2. 使用 context.request 或 page.request 重新发送这个请求 # 注意page.request 是 Playwright 提供的高级API用于测试但也可用于爬虫。 # 更通用的方式是使用如 requests 库但这里为了保持纯 Playwright 环境我们使用 page.request response page.request.get(url) # 这是一个简化示例实际需要传递headers等 # 获取响应状态和JSON体 status response.status try: json_body response.json() captured_data.append(json_body) print(f成功捕获数据共 {len(json_body.get(quotes, []))} 条记录) # 将原始响应返回给页面确保页面JS能正常工作 route.fulfill( statusstatus, headersresponse.headers, bodyresponse.text() ) except Exception as e: print(f解析响应失败: {e}) # 如果失败还是继续原请求 route.continue_() else: # 非目标请求直接放行 route.continue_() # 由于 handle_route 是 async 函数我们需要用 page.route 的相应模式。 # 在同步API中我们需要将 async 函数包装一下或者使用另一种模式。 # 更简单的同步写法是使用 page.on(response) print(此示例演示了思路更完整的同步代码见下方) page.goto(http://quotes.toscrape.com/js/) page.wait_for_timeout(3000) browser.close() return captured_data4.3 最终可行的同步代码方案经过实践对于同步脚本最可靠且简洁的方案是使用page.route()拦截并在回调中通过route.continue_()让请求继续然后立即或在全局通过监听page.on(‘response’)事件来处理我们刚放行的那个请求的响应。这需要一点技巧来关联请求和响应。我们可以利用请求的URL作为唯一标识。from playwright.sync_api import sync_playwright import json def intercept_with_route_and_event(): captured_data [] target_url_pattern **/api/quotes* # 使用Playwright的匹配模式 with sync_playwright() as p: browser p.chromium.launch(headlessTrue) context browser.new_context() page context.new_page() # 创建一个字典来临时存储请求信息以便response事件能识别 # 实际上response对象本身就有对应的request属性所以更简单。 # 第一步设置路由所有请求先经过这里 def route_handler(route): # 对于所有请求我们都先放行 route.continue_() page.route(target_url_pattern, route_handler) # 第二步监听响应事件只处理我们路由过的即匹配模式的请求的响应 def on_response(response): # response.request 可以获取到对应的请求对象 request response.request if request.url in captured_urls: return # 避免重复处理 if /api/quotes in request.url: print(f捕获到API响应: {response.status} {request.url}) try: # 尝试解析JSON json_data response.json() captured_data.append(json_data) # 标记这个URL已处理 captured_urls.add(request.url) # 打印一部分数据看看 quotes json_data.get(quotes, []) for quote in quotes[:2]: # 只打印前两条 print(f - {quote.get(text)[:50]}...) except json.JSONDecodeError: # 如果不是JSON可以尝试读取文本 print(f响应不是JSON格式: {response.text()[:100]}) captured_urls set() page.on(response, on_response) # 访问页面 page.goto(http://quotes.toscrape.com/js/) # 等待可能由滚动等触发的后续请求这里简单等待 page.wait_for_timeout(5000) # 保存数据到文件 if captured_data: with open(quotes_data.json, w, encodingutf-8) as f: json.dump(captured_data, f, ensure_asciiFalse, indent2) print(f数据已保存到 quotes_data.json) browser.close() if __name__ __main__: intercept_with_route_and_event()这个方案运行后你能在控制台看到捕获的JSON数据并且当前目录下会生成一个quotes_data.json文件里面就是纯净的API返回数据。页面渲染也不受影响。5. 高级技巧与复杂场景应对掌握了基础拦截后我们来看看实际项目中可能遇到的复杂情况及应对策略。5.1 处理分页与滚动加载很多动态网站采用滚动加载无限滚动或点击分页按钮加载更多数据。我们的拦截器需要能捕获这些后续请求。策略在设置好路由和监听后通过Playwright模拟用户滚动或点击。示例# 假设页面是滚动加载 page.goto(https://example.com/scrollable-feed) # 监听响应 def on_response(response): if load-more in response.url: print(f捕获到新数据: {response.url}) page.on(response, on_response) # 模拟多次滚动 for i in range(5): # 滚动到页面底部 page.evaluate(window.scrollTo(0, document.body.scrollHeight)) # 等待新数据加载 page.wait_for_timeout(2000)注意wait_for_timeout是固定等待不够健壮。更好的做法是等待某个特定元素出现或等待网络空闲page.wait_for_load_state(networkidle)。5.2 处理需要认证登录的接口有些API需要在请求头中携带认证信息如Authorization: Bearer token或Cookies。策略先使用Playwright完成登录流程获取到登录后的浏览器上下文context这个上下文会自动管理Cookies。然后用这个上下文去创建页面并访问目标页拦截的请求就会自动携带认证信息。示例def login_and_crawl(): with sync_playwright() as p: browser p.chromium.launch(headlessFalse) context browser.new_context() page context.new_page() # 1. 访问登录页并登录 page.goto(https://example.com/login) page.fill(#username, your_username) page.fill(#password, your_password) page.click(button[typesubmit]) # 等待登录成功通常可以等待导航完成或某个登录后元素出现 page.wait_for_url(**/dashboard**) print(登录成功) # 2. 登录后的context已经包含了session cookie # 3. 用这个context或新开一个标签页访问数据页面并拦截 data_page context.new_page() # ... 设置拦截逻辑 ... data_page.goto(https://example.com/data-page) # ...实操心得登录过程可能遇到验证码、动态令牌等。Playwright可以处理简单的图片验证码通过截图后使用OCR库识别但对于复杂验证码可能需要人工干预或使用第三方打码服务。务必确保你的自动化登录行为符合网站的服务条款。5.3 拦截并修改请求或响应有时我们不仅想抓取数据还想修改请求参数或响应内容来测试或模拟特定条件。修改请求在route.continue_()之前可以修改请求的URL、方法、头信息或POST数据。def route_handler(route): # 创建一个新的请求对象基于原始请求修改 headers route.request.headers headers[x-custom-header] my-value # 添加自定义头 # 然后继续请求 route.continue_(headersheaders)修改响应使用route.fulfill()直接返回一个自定义的响应体而不是继续真实请求。def route_handler(route): if block-this-ad in route.request.url: # 拦截广告请求返回空数据 route.fulfill( status200, content_typeapplication/json, bodyjson.dumps({}) ) else: route.continue_()5.4 性能优化与反反爬策略禁用不必要的资源加载图片、样式表、字体等资源对爬虫无用却拖慢速度。可以在创建浏览器上下文时进行配置。context browser.new_context( viewport{width: 1920, height: 1080}, # 忽略图片、样式等 bypass_cspTrue, # 有时需要绕过内容安全策略 java_script_enabledTrue, # JS必须开启因为我们要抓动态内容 ) # 更细粒度的控制可以使用 route.abort() def route_handler(route): req route.request resource_type req.resource_type if resource_type in [image, stylesheet, font, media]: route.abort() else: route.continue_() page.route(**/*, route_handler)使用代理IP应对IP封锁。browser p.chromium.launch( headlessTrue, proxy{ server: http://your-proxy-server:port, username: user, # 如果需要认证 password: pass } )模拟真人行为添加随机延迟、模拟鼠标移动轨迹等。Playwright可以模拟各种输入设备。import random page.mouse.move(random.randint(100, 500), random.randint(100, 500)) page.wait_for_timeout(random.uniform(100, 1000)) # 随机等待6. 常见问题排查与调试技巧实录在实际操作中你肯定会遇到各种问题。这里记录了几个我踩过的坑和解决方法。6.1 拦截不到请求可能原因1请求在页面加载前就已发起。有些数据请求可能在page.goto()之前由初始化脚本发起。解决方案在创建页面后、goto之前就设置好路由和事件监听。可能原因2请求来自iframe或子frame。page.route()默认只拦截主frame的请求。你需要为每个子frame单独设置路由或者使用page.on(framenavigated)事件来监听新frame并为其添加路由。def on_frame_navigated(frame): frame.route(**/api/*, sub_frame_route_handler) page.on(framenavigated, on_frame_navigated)可能原因3URL匹配模式不对。Playwright的匹配模式支持通配符*匹配任意字符**匹配任意路径段。使用page.on(response)先打印出所有请求URL确认目标URL的准确模式。6.2 捕获到的响应体是空的或乱码检查响应状态码确保请求成功状态码2xx。检查响应头content-type确认是application/json。如果是gzip压缩的Playwright的response.body()会自动解压。但如果你用response.text()得到乱码可以尝试用response.body()获取字节流然后根据情况解码或解压。body_bytes response.body() # 如果是gzipPlaywright已处理这里直接解码 try: text body_bytes.decode(utf-8) except UnicodeDecodeError: # 尝试其他编码 text body_bytes.decode(gbk, errorsignore)6.3 页面JS报错功能不正常原因我们的拦截操作可能意外破坏了页面逻辑。比如如果我们拦截了某个关键JS文件的请求并abort了它或者修改了某个API的响应格式。排查在浏览器中按F12打开开发者工具查看Console和Network标签页看是否有红色错误信息。在Playwright脚本中设置headlessFalse观察页面实际渲染情况。解决确保非目标请求被正确放行route.continue_()。对于目标API请求使用“记录并放行”模式而不是直接fulfill一个修改过的响应除非你完全清楚其数据结构。6.4 脚本运行速度慢启用无头模式launch(headlessTrue)。禁用无关资源如上文所述拦截图片、CSS等。复用浏览器上下文不要为每个任务都启动关闭浏览器。可以启动一次浏览器完成多个抓取任务后再关闭。并行化对于大量独立页面可以使用asyncio创建多个page实例并行处理但注意控制并发数避免对目标服务器造成过大压力。6.5 遇到反爬虫机制如Cloudflare现象页面返回验证码页面或一直处于“正在检查浏览器”状态。Playwright的局限性Playwright本身无法绕过高级的反爬服务。它的浏览器指纹虽然比Selenium更接近真实浏览器但仍可能被检测。应对策略降低频率增加请求间隔模拟真人操作。使用更真实的配置创建浏览器上下文时设置完整的user_agent、viewport、locale等。context browser.new_context( user_agentMozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 ..., viewport{width: 1920, height: 1080}, localezh-CN, timezone_idAsia/Shanghai, )考虑专业工具对于顽固的反爬可能需要使用更底层的浏览器自动化工具如undetected-chromedriver或商业反爬服务。最后再分享一个调试小技巧在关键步骤使用page.screenshot(pathdebug.png)截图或者使用page.pause()方法让脚本暂停这时你可以像在普通浏览器里一样手动操作和检查输入playwright.resume()继续执行。这在排查页面交互问题时非常有用。