网络

简介

Playwright 提供了用于监控和修改浏览器网络流量（包括 HTTP 和 HTTPS）的 API。页面发起的任何请求，包括 XHR 和 fetch 请求，都可以被跟踪、修改和处理。

模拟 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) 代理指定用户名和密码，还可以指定绕过 Proxy 的主机。

以下是全局代理的示例：

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" },
});

网络事件

你可以监控所有的 [请求（Request）] 和 [响应（Response）]：

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() 在点击按钮后等待网络响应：

// 使用通配符 URL 模式
var waitForResponseTask = page.WaitForResponseAsync("**/api/fetch_data");
await page.GetByText("Update").ClickAsync();
var response = await waitForResponseTask;

变体

使用 Page.RunAndWaitForResponseAsync() 等待 [响应（Response）]

// 使用正则表达式
var waitForResponseTask = page.WaitForResponseAsync(new Regex("\\.jpeg$"));
await page.GetByText("Update").ClickAsync();
var response = await waitForResponseTask;

// 使用接受 Response 对象的谓词
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");

修改请求

// 删除请求头
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 });
});

// 将请求继续作为 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());

// 根据请求类型中止请求
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 =>
{
    // 获取原始响应。
    var response = await route.FetchAsync();
    // 给标题添加前缀。
    var body = await response.TextAsync();
    body = body.Replace("<title>", "<title>我的前缀:");

    var headers = response.Headers;
    headers.Add("Content-Type", "text/html");

    await route.FulfillAsync(new()
    {
        // 传递响应中的所有字段。
        Response = response,
        // 覆盖响应正文。
        Body = body,
        // 强制内容类型为 html。
        Headers = headers,
    });
});

全局 URL 模式

Playwright 在诸如 Page.RouteAsync() 或 Page.RunAndWaitForResponseAsync() 等网络拦截方法中，使用简化的全局模式来匹配 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] 而不是全局模式。

WebSocket

Playwright 原生支持 WebSocket 检查、模拟和修改。有关如何模拟 WebSocket 的信息，请参阅我们的 API 模拟指南。

每次创建 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 Workers 缺失

Playwright 内置的 BrowserContext.RouteAsync() 和 Page.RouteAsync() 允许你的测试原生地路由请求并执行模拟和拦截。

如果你正在使用 Playwright 原生的 BrowserContext.RouteAsync() 和 Page.RouteAsync()，且似乎网络事件缺失，请通过将 ServiceWorkers 设置为 'block' 来禁用 Service Workers。
可能你正在使用诸如 Mock Service Worker（MSW）之类的模拟工具。虽然该工具可直接用于模拟响应，但它会添加自己的 Service Worker 来接管网络请求，因此使得这些请求对 BrowserContext.RouteAsync() 和 Page.RouteAsync() 不可见。如果你对网络测试和模拟都感兴趣，可以考虑使用内置的 BrowserContext.RouteAsync() 和 Page.RouteAsync() 进行响应模拟。
如果你不仅对使用 Service Workers 进行测试和网络模拟感兴趣，还对路由和监听由 Service Workers 自身发出的请求感兴趣，请参阅此实验性功能。

简介​

模拟 API​

HTTP 身份验证​

HTTP 代理​

网络事件​

变体​

处理请求​

变体​

修改请求​

中止请求​

修改响应​

全局 URL 模式​

WebSocket​

网络事件和 Service Workers 缺失​

简介