跳至主要内容

身份验证

简介

Playwright 在称为浏览器上下文的隔离环境中执行测试。此隔离模型提高了可重复性,并防止了级联测试失败。测试可以加载现有的已认证状态。这消除了在每个测试中进行身份验证的需要,并加快了测试执行速度。

核心概念

无论您选择哪种身份验证策略,您都可能将已认证的浏览器状态存储在文件系统上。

我们建议创建 playwright/.auth 目录并将其添加到您的 .gitignore 中。您的身份验证例程将生成已认证的浏览器状态并将其保存到此 playwright/.auth 目录中的文件中。稍后,测试将重用此状态并以已认证状态启动。

mkdir -p playwright/.auth
echo $'\nplaywright/.auth' >> .gitignore

在每个测试之前登录

Playwright API 可以自动与登录表单交互

以下示例登录 GitHub。执行这些步骤后,浏览器上下文将被认证。

var page = await context.NewPageAsync();
await page.GotoAsync("https://github.com/login");
// Interact with login form
await page.GetByLabel("Username or email address").FillAsync("username");
await page.GetByLabel("Password").FillAsync("password");
await page.GetByRole(AriaRole.Button, new() { Name = "Sign in" }).ClickAsync();
// Continue with the test

对每个测试都重新执行登录可能会降低测试执行速度。为了减轻这种情况,请改用现有的身份验证状态。

重用已登录状态

Playwright 提供了一种在测试中重用已登录状态的方法。这样,您只需登录一次,然后跳过所有测试的登录步骤。

Web 应用使用基于 Cookie 或基于令牌的身份验证,其中已认证状态存储为Cookie或在本地存储中。Playwright 提供了BrowserContext.StorageStateAsync() 方法,可用于从已认证的上下文中检索存储状态,然后创建具有预填充状态的新上下文。

Cookie 和本地存储状态可以在不同的浏览器之间使用。它们取决于您的应用程序的身份验证模型:某些应用程序可能需要 Cookie 和本地存储。

以下代码片段从已认证的上下文中检索状态,并使用该状态创建一个新上下文。

// Save storage state into the file.
// Tests are executed in <TestProject>\bin\Debug\netX.0\ therefore relative path is used to reference playwright/.auth created in project root
await context.StorageStateAsync(new()
{
Path = "../../../playwright/.auth/state.json"
});

// Create a new context with the saved storage state.
var context = await browser.NewContextAsync(new()
{
StorageStatePath = "../../../playwright/.auth/state.json"
});

高级场景

会话存储

重用已认证状态涵盖了Cookie本地存储基于的身份验证。很少情况下,会话存储用于存储与已登录状态关联的信息。会话存储特定于特定域,并且不会跨页面加载持久化。Playwright 未提供持久化会话存储的 API,但以下代码片段可用于保存/加载会话存储。

// Get session storage and store as env variable
var sessionStorage = await page.EvaluateAsync<string>("() => JSON.stringify(sessionStorage)");
Environment.SetEnvironmentVariable("SESSION_STORAGE", sessionStorage);

// Set session storage in a new context
var loadedSessionStorage = Environment.GetEnvironmentVariable("SESSION_STORAGE");
await context.AddInitScriptAsync(@"(storage => {
if (window.location.hostname === 'example.com') {
const entries = JSON.parse(storage);
for (const [key, value] of Object.entries(entries)) {
window.sessionStorage.setItem(key, value);
}
}
})('" + loadedSessionStorage + "')");