网络
简介
Playwright 提供了用于监控和修改浏览器网络流量(包括 HTTP 和 HTTPS)的 API。页面发起的任何请求,包括 XHR 和 fetch 请求,都可以被跟踪、修改和处理。
模拟 API
查看我们的 API 模拟指南,以了解更多关于以下内容的信息:
- 模拟 API 请求,永不实际访问 API
- 执行 API 请求并修改响应
- 使用 HAR 文件模拟网络请求。
HTTP 身份验证
执行 HTTP 身份验证。
BrowserContext context = browser.newContext(new Browser.NewContextOptions()
.setHttpCredentials("bill", "pa55w0rd"));
Page page = context.newPage();
page.navigate("https://example.com");
HTTP 代理
你可以配置页面通过 HTTP(S) 代理或 SOCKSv5 进行加载。代理既可以全局设置应用于整个浏览器,也可以为每个浏览器上下文单独设置。
对于 HTTP(S) 代理,你可以选择指定用户名和密码,还可以指定绕过 setProxy 的主机。
以下是全局代理的示例:
Browser browser = chromium.launch(new BrowserType.LaunchOptions()
.setProxy(new Proxy("http://myproxy.com:3128")
.setUsername("usr")
.setPassword("pwd")));
也可以为每个上下文单独指定代理:
Browser browser = chromium.launch();
BrowserContext context = browser.newContext(new Browser.NewContextOptions()
.setProxy(new Proxy("http://myproxy.com:3128")));
网络事件
你可以监控所有的 [请求](Request)和 [响应](Response):
import com.microsoft.playwright.*;
public class Example {
public static void main(String[] args) {
try (Playwright playwright = Playwright.create()) {
BrowserType chromium = playwright.chromium();
Browser browser = chromium.launch();
Page page = browser.newPage();
page.onRequest(request -> System.out.println(">> " + request.method() + " " + request.url()));
page.onResponse(response -> System.out.println("<<" + response.status() + " " + response.url()));
page.navigate("https://example.com");
browser.close();
}
}
}
或者使用 Page.waitForResponse() 在点击按钮后等待网络响应:
// 使用通配符 URL 模式
Response response = page.waitForResponse("**/api/fetch_data", () -> {
page.getByText("Update").click();
});
变体
使用 Page.waitForResponse() 等待 [响应](Response)
// 使用正则表达式
Response response = page.waitForResponse(Pattern.compile("\\.jpeg$"), () -> {
page.getByText("Update").click();
});
// 使用接受 Response 对象的谓词
Response response = page.waitForResponse(r -> r.url().contains(token), () -> {
page.getByText("Update").click();
});
处理请求
page.route("**/api/fetch_data", route -> route.fulfill(new Route.FulfillOptions()
.setStatus(200)
.setBody(testData)));
page.navigate("https://example.com");
你可以通过在 Playwright 脚本中处理网络请求来模拟 API 端点。
变体
使用 BrowserContext.route() 在整个浏览器上下文上设置路由,或使用 Page.route() 在页面上设置路由。这将应用于弹出窗口和打开的链接。
browserContext.route("**/api/login", route -> route.fulfill(new Route.FulfillOptions()
.setStatus(200)
.setBody("accept")));
page.navigate("https://example.com");
修改请求
// 删除标头
page.route("**/*", route -> {
Map<String, String> headers = new HashMap<>(route.request().headers());
headers.remove("X-Secret");
route.resume(new Route.ResumeOptions().setHeaders(headers));
});
// 以 POST 方式继续请求。
page.route("**/*", route -> route.resume(new Route.ResumeOptions().setMethod("POST")));
你可以带着修改继续请求。上面的示例从传出请求中删除了一个 HTTP 标头。
中止请求
你可以使用 Page.route() 和 Route.abort() 中止请求。
page.route("**/*.{png,jpg,jpeg}", route -> route.abort());
// 根据请求类型中止
page.route("**/*", route -> {
if ("image".equals(route.request().resourceType()))
route.abort();
else
route.resume();
});
修改响应
要修改响应,可以使用 APIRequestContext 获取原始响应,然后将响应传递给 Route.fulfill()。你可以通过选项覆盖响应中的各个字段:
page.route("**/title.html", route -> {
// 获取原始响应。
APIResponse response = route.fetch();
// 给标题添加前缀。
String body = response.text();
body = body.replace("<title>", "<title>我的前缀:");
Map<String, String> headers = response.headers();
headers.put("content-type", "text/html");
route.fulfill(new Route.FulfillOptions()
// 传递响应中的所有字段。
.setResponse(response)
// 覆盖响应正文。
.setBody(body)
// 强制内容类型为 html。
.setHeaders(headers));
});
全局 URL 模式
Playwright 在诸如 Page.route() 或 Page.waitForResponse() 等网络拦截方法中,使用简化的全局模式来匹配 URL。这些模式支持基本通配符:
- 星号:
- 单个
*
匹配除/
之外的任何字符 - 双
**
匹配包括/
在内的任何字符
- 单个
- 问号
?
仅匹配问号?
。如果要匹配任意字符,请使用*
代替。 - 花括号
{}
可用于匹配以逗号,
分隔的选项列表 - 反斜杠
\
可用于转义任何特殊字符(注意要将反斜杠本身转义为\\
)
示例:
https://example.com/*.js
匹配https://example.com/file.js
,但不匹配https://example.com/path/file.js
https://example.com/?page=1
匹配https://example.com/?page=1
,但不匹配https://example.com
**/*.js
匹配https://example.com/file.js
和https://example.com/path/file.js
**/*.{png,jpg,jpeg}
匹配所有图像请求
重要说明:
- 全局模式必须匹配整个 URL,而不仅仅是其中一部分。
- 使用全局模式进行 URL 匹配时,要考虑完整的 URL 结构,包括协议和路径分隔符。
- 对于更复杂的匹配需求,考虑使用 [RegExp] 而不是全局模式。
WebSockets
Playwright 原生支持 WebSockets 检查、模拟和修改。有关如何模拟 WebSockets 的信息,请参阅我们的 API 模拟指南。
每次创建 WebSocket 时,都会触发 Page.onWebSocket(handler) 事件。此事件包含 WebSocket 实例,用于进一步检查 WebSocket 帧:
page.onWebSocket(ws -> {
log("WebSocket opened: " + ws.url());
ws.onFrameSent(frameData -> log(frameData.text()));
ws.onFrameReceived(frameData -> log(frameData.text()));
ws.onClose(ws1 -> log("WebSocket closed"));
});
缺少网络事件和 Service Workers
Playwright 内置的 BrowserContext.route() 和 Page.route() 允许你的测试原生地路由请求并执行模拟和拦截操作。
- 如果你正在使用 Playwright 原生的 BrowserContext.route() 和 Page.route(),但似乎缺少网络事件,可以通过将 setServiceWorkers 设置为
'block'
来禁用 Service Workers。 - 可能你正在使用诸如 Mock Service Worker(MSW)之类的模拟工具。虽然该工具可直接用于模拟响应,但它会添加自己的 Service Worker 来接管网络请求,因此使得这些请求对 BrowserContext.route() 和 Page.route() 不可见。如果你对网络测试和模拟都感兴趣,可以考虑使用内置的 BrowserContext.route() 和 Page.route() 进行 响应模拟。
- 如果你不仅对使用 Service Workers 进行测试和网络模拟感兴趣,还对路由和监听 Service Workers 自身发出的请求感兴趣,请参阅 此实验性功能。