下面介紹一下 Playwright 中的基本概念：

Headless 瀏覽器

Playwright 需要特定版本的瀏覽器二進制文件才能運行。這些瀏覽器都支持 2 種 運行模式：

• Headless，無瀏覽器 UI，運行速度較快，常用于自動化運行

• Headed，有瀏覽器 UI，常用于調試代碼

Playwright 默認使用的是 Headless 模式，設置BrowserTypeLaunchOptions可以關閉 Headless 模式：

var?browser?=?await?playwright.Chromium.LaunchAsync(new?BrowserTypeLaunchOptions?{?Headless?=?false?});

對象模型

Playwright 定義了如下這些對象模型：

Browser 瀏覽器

Browser是 Playwright 通過BrowserType.LaunchAsync(options)方法創建的瀏覽器對象。

可選的 BrowserType 包括：

• Chromium，Playwright 默認使用開源的 Chromium 瀏覽器。但是可以通過參數指定使用 Google Chrome 或者 Microsoft Edge 瀏覽器：

using?var?playwright?=?await?Playwright.CreateAsync();
var?chromium?=?playwright.Chromium;// channel 參數指定瀏覽器分發通道。值可以為“chrome”、“chrome-beta”、“chrome-dev”、“chrome-canary”、“msedge”、“msedge-beta”、“msedge-dev”、“msedge-canary”
var?browser?=?await?chromium.LaunchAsync(
new?BrowserTypeLaunchOptions?{?Channel?=?"chrome"?});

• Firefox，與最近的 Firefox 穩定版相匹配。

• WebKit，與最近的 WebKit trunk 版本相匹配，版本領先于 Apple Safari 和其他基于 WebKit 的瀏覽器。

BrowserContext 瀏覽器上下文

BrowserContext 提供了一種操作多個獨立瀏覽器會話的方法。每個Browser實例都包含一個默認的BrowserContext實例。

可以使用Browser.NewContextAsync方法創建“隱身”瀏覽器上下文。“隱身”瀏覽器上下文類似于 Google Chrome 的無痕式窗口，可以在瀏覽器會話之間隔離瀏覽器狀態：

var?browserContext1?=?await?browser.NewContextAsync();
Console.WriteLine($"browserContext1?Session?{await?GetSession(browserContext1)}");
Console.WriteLine($"browserContext1?Session?{await?GetSession(browserContext1)}");var?browserContext2?=?await?browser.NewContextAsync();
Console.WriteLine($"browserContext2?Session?{await?GetSession(browserContext2)}");private?static?async?Task<string>?GetSession(IBrowserContext?browserContext)
{var?page?=?await?browserContext.NewPageAsync();await?page.GotoAsync("https://account.cnblogs.com/signin");var?cookies?=?await?browserContext1.CookiesAsync();return?cookies.First(p?=>?p.Name?==?".Cnblogs.Account.Session").Value;
}//同一瀏覽器上下文獲得的會話ID相同
browserContext1?Session?CfDJ8AuMt%2F3FvyxIgNOR82PHE4no0sUf7I3NiZ5vRmbIv9lQrRo3aoAkQ7RAm4ddlBoLAk40iVfg10%2F%2FRvnRY5MCZ6zeVMunRoeM3mqKkyh0nWK5HWvj7RAq1krRzqA%2BQW%2BXCqpdf3kBJvmjC1uACr3h4kVeaY2nqTY%2FRJ3Tp55Fo3aS
browserContext1?Session?CfDJ8AuMt%2F3FvyxIgNOR82PHE4no0sUf7I3NiZ5vRmbIv9lQrRo3aoAkQ7RAm4ddlBoLAk40iVfg10%2F%2FRvnRY5MCZ6zeVMunRoeM3mqKkyh0nWK5HWvj7RAq1krRzqA%2BQW%2BXCqpdf3kBJvmjC1uACr3h4kVeaY2nqTY%2FRJ3Tp55Fo3aS//不同瀏覽器上下文獲得的會話ID不同
browserContext2?Session?CfDJ8AuMt%2F3FvyxIgNOR82PHE4k6gMjjX4oHDpKiyNDycdgnx5YlW%2Bd00yS1ztwodcO6QH%2B38HHwyzdNQ3ClVdlstFdcrJw0TDLqq6atFm%2F%2FH3TcLc18%2BQEN0MOQmRbFT39hq77AZ%2FF%2BlZ2bc9svnB%2FEpU%2FDmiP5eLWXK9V2Fn0jKIiM

Page 頁面

Page是指瀏覽器上下文中的單個選項卡或彈出窗口。每個BrowserContext可以有多個Page。

var?page?=?await?browserContext.NewPageAsync();
await?page.GotoAsync("https://account.cnblogs.com/signin");

Frame 框架

一個Page可以包含一個或多個Frame對象。每個頁面都有一個MainFrame，并且假定頁面級交互（如點擊）在MainFrame中操作。可以通過訪問這些Frame以進行框架內的交互。

var?page?=?await?browser.NewPageAsync();
await?page.GotoAsync("https://www.w3school.com.cn/tiy/t.asp?f=eg_html_frame_mix");
DumpFrameTree(page.MainFrame,?string.Empty);//顯示?Frame?嵌套樹
private?static?void?DumpFrameTree(IFrame?frame,?string?indent)
{Console.WriteLine($"{indent}{frame.Url}");foreach?(var?child?in?frame.ChildFrames)DumpFrameTree(child,?indent?+?"?");
}

Locator 定位器

Locator代表了一種隨時在頁面上查找元素的方法。可以使用Page.Locator(selector, options)方法創建定位器。

//查找?title?元素，例如"<title>百度一下，你就知道</title>"
var?locator?=?page.Locator("title");
Console.WriteLine(await?locator.InnerTextAsync());

結論

通過靈活應用上述對象模型以及對象模型提供的方法，我們可以實現編寫代碼來創建新的瀏覽器頁面，導航到 URL，然后與頁面上的元素進行交互。

添加微信號【MyIO666】，邀你加入技術交流群