网络
介绍
Playwright 提供了用于监控和修改浏览器网络流量(包括 HTTP 和 HTTPS)的 API。页面发出的任何请求,包括 XHR 和 fetch 请求,都可以被跟踪、修改和处理。
模拟 API
请查阅我们的API 模拟指南,了解如何
- 模拟 API 请求,永远不实际调用 API
- 执行 API 请求并修改响应
- 使用 HAR 文件来模拟网络请求。
HTTP 身份验证
执行 HTTP 身份验证。
using var context = await Browser.NewContextAsync(new()
{
HttpCredentials = new HttpCredentials
{
Username = "bill",
Password = "pa55w0rd"
},
});
var page = await context.NewPageAsync();
await page.GotoAsync("https://example.com");
HTTP 代理
您可以配置页面通过 HTTP(S) 代理或 SOCKSv5 加载。代理既可以全局设置于整个浏览器,也可以单独设置于每个浏览器上下文。
您可以选择为 HTTP(S) 代理指定用户名和密码,还可以指定要绕过此代理的主机。
这里是一个全局代理的示例
var proxy = new Proxy
{
Server = "http://myproxy.com:3128",
Username = "user",
Password = "pwd"
};
await using var browser = await BrowserType.LaunchAsync(new()
{
Proxy = proxy
});
也可以按上下文指定
await using var browser = await BrowserType.LaunchAsync();
await using var context = await browser.NewContextAsync(new()
{
Proxy = new Proxy { Server = "http://myproxy.com:3128" },
});
网络事件
using Microsoft.Playwright;
using var playwright = await Playwright.CreateAsync();
await using var browser = await playwright.Chromium.LaunchAsync();
var page = await browser.NewPageAsync();
page.Request += (_, request) => Console.WriteLine(">> " + request.Method + " " + request.Url);
page.Response += (_, response) => Console.WriteLine("<< " + response.Status + " " + response.Url);
await page.GotoAsync("https://example.com");
或者使用 Page.RunAndWaitForResponseAsync() 在按钮点击后等待网络响应
// Use a glob URL pattern
var waitForResponseTask = page.WaitForResponseAsync("**/api/fetch_data");
await page.GetByText("Update").ClickAsync();
var response = await waitForResponseTask;
变体
使用 Page.RunAndWaitForResponseAsync() 等待响应
// Use a regular expression
var waitForResponseTask = page.WaitForResponseAsync(new Regex("\\.jpeg$"));
await page.GetByText("Update").ClickAsync();
var response = await waitForResponseTask;
// Use a predicate taking a Response object
var waitForResponseTask = page.WaitForResponseAsync(r => r.Url.Contains(token));
await page.GetByText("Update").ClickAsync();
var response = await waitForResponseTask;
处理请求
您可以通过在 Playwright 脚本中处理网络请求来模拟 API 端点。
变体
使用 BrowserContext.RouteAsync() 在整个浏览器上下文上设置路由,或使用 Page.RouteAsync() 在页面上设置路由。它将应用于弹出窗口和打开的链接。
await page.RouteAsync("**/api/fetch_data", async route => {
await route.FulfillAsync(new() { Status = 200, Body = testData });
});
await page.GotoAsync("https://example.com");
修改请求
// Delete header
await page.RouteAsync("**/*", async route => {
var headers = new Dictionary<string, string>(route.Request.Headers.ToDictionary(x => x.Key, x => x.Value));
headers.Remove("X-Secret");
await route.ContinueAsync(new() { Headers = headers });
});
// Continue requests as POST.
await Page.RouteAsync("**/*", async route => await route.ContinueAsync(new() { Method = "POST" }));
您可以继续请求并进行修改。上面的示例从出站请求中删除了一个 HTTP 头。
中止请求
您可以使用 Page.RouteAsync() 和 Route.AbortAsync() 中止请求。
await page.RouteAsync("**/*.{png,jpg,jpeg}", route => route.AbortAsync());
// Abort based on the request type
await page.RouteAsync("**/*", async route => {
if ("image".Equals(route.Request.ResourceType))
await route.AbortAsync();
else
await route.ContinueAsync();
});
修改响应
要修改响应,请使用APIRequestContext 获取原始响应,然后将响应传递给 Route.FulfillAsync()。您可以通过选项覆盖响应中的单个字段
await Page.RouteAsync("**/title.html", async route =>
{
// Fetch original response.
var response = await route.FetchAsync();
// Add a prefix to the title.
var body = await response.TextAsync();
body = body.Replace("<title>", "<title>My prefix:");
var headers = response.Headers;
headers.Add("Content-Type", "text/html");
await route.FulfillAsync(new()
{
// Pass all fields from the response.
Response = response,
// Override response body.
Body = body,
// Force content type to be html.
Headers = headers,
});
});
Glob URL 模式
Playwright 在 Page.RouteAsync() 或 Page.RunAndWaitForResponseAsync() 等网络拦截方法中使用简化的 glob 模式进行 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}
匹配所有图片请求
重要注意事项
- glob 模式必须匹配整个 URL,而不仅仅是其中的一部分。
- 使用 glob 进行 URL 匹配时,请考虑完整的 URL 结构,包括协议和路径分隔符。
- 对于更复杂的匹配要求,请考虑使用 [RegExp] 而非 glob 模式。
WebSockets
Playwright 原生支持 WebSockets 的检查、模拟和修改。请查阅我们的API 模拟指南,了解如何模拟 WebSockets。
每次创建 WebSocket 时,都会触发 Page.WebSocket 事件。此事件包含用于进一步检查 WebSocket 帧的 WebSocket 实例
page.WebSocket += (_, ws) =>
{
Console.WriteLine("WebSocket opened: " + ws.Url);
ws.FrameSent += (_, f) => Console.WriteLine(f.Text);
ws.FrameReceived += (_, f) => Console.WriteLine(f.Text);
ws.Close += (_, ws1) => Console.WriteLine("WebSocket closed");
};
缺少的网络事件和 Service Worker
Playwright 内置的 BrowserContext.RouteAsync() 和 Page.RouteAsync() 允许您的测试原生路由请求并执行模拟和拦截。
- 如果您正在使用 Playwright 原生的 BrowserContext.RouteAsync() 和 Page.RouteAsync(),并且发现网络事件丢失,请通过将 ServiceWorkers 设置为
'block'
来禁用 Service Worker。 - 可能是您正在使用 Mock Service Worker (MSW) 等模拟工具。虽然此工具可以原生模拟响应,但它添加了自己的 Service Worker,接管了网络请求,从而使得这些请求对 BrowserContext.RouteAsync() 和 Page.RouteAsync() 不可见。如果您对网络测试和模拟都感兴趣,请考虑使用内置的 BrowserContext.RouteAsync() 和 Page.RouteAsync() 进行响应模拟。
- 如果您不仅对使用 Service Worker 进行测试和网络模拟感兴趣,还对路由和监听 Service Worker 本身发出的请求感兴趣,请参阅此实验性功能。