Agent Skills
返回列表
💻

Playwright 网络拦截器

开发编程 更新于 2026.08.29

将以下提示词粘贴到你的 AI 对话框中:

请根据 https://skillhub.cn/install/skillhub.md,安装 @user_3c6cb52e/playwright-network-interceptor

技能介绍

解决的问题

当前端依赖未稳定的第三方接口时,开发者常陷入三类困境:联调前无法准备边界响应(如超时、空数组或鉴权失败),排查弱网与异常分支耗时久,且需要复现一次请求的 URL、请求头、响应体细节时,手工 DevTools 操作难以固化。Playwright 网络拦截器把浏览器请求生命周期变成可编程事件,在请求发出前就介入。

核心能力与关键步骤

  • 请求/响应改写:通过 page.route() 注册拦截器,命中规则的请求被中止、伪造或转发;可在响应到达页面前替换状态码、响应头与响应体。
  • API 响应捕获:在 request 与 response 事件中读取元数据与负载,供断言、落盘或上报,便于回归测试覆盖异常分支。
  • HAR 录制:按规范导出 HTTP Archive,回放与审计请求序列,形成可共享的会话证据。

执行路径大致为:定义匹配模式 → 注册 route handler → 在 handler 内构造 route.fulfill() 或 route.continue() → 按需 page.pause() 进入可视化调试。

适用边界与注意点

它适合 E2E 测试、契约演练与接口 mock 场景,但拦截发生在协议栈之上,无法绕过 DNS、TCP 层;过大的 response 缓冲可能引入额外延迟;录制 HAR 时应确认不含敏感字段。修改响应时要同步更新 CSP 或校验逻辑,否则页面可能静默失败。

使用场景

  • 前端联调依赖外部订单接口,需要把超时和空数组等边界响应固化成可重复回放的测试用例。
  • 编写登录流程回归脚本,在路由层拦截验证码校验请求,用预置失败响应验证页面错误提示与跳转。
  • 录制一次完整购物车交互为 HAR 文件,交由 QA 在无后端环境回放,定位重定向丢失问题。
  • 将第三方支付回调替换为可控响应体,核对订单金额与 CSP 头是否在真机上保持一致。

适合人员

  • 编写端到端测试的前端工程师,需要在请求发出前注入异常响应并断言页面状态。
  • 负责接口契约评审的后端工程师,想捕获真实调用序列并生成 HAR 供跨团队复现。
  • 调试弱网下支付回调的移动端开发者,希望拦截并改写网络响应验证边界行为。
  • 构建低代码平台内置 mock 的服务端开发者,要求以统一规则替换第三方 API 返回。