如何在Playwright中通过API调用实现浏览器扩展认证？

1. 直接往扩展的存储中写入认证信息 #

扩展通常会把登录状态存在chrome.storage.local或者localStorage里，你可以通过Playwright执行扩展页面的脚本，把获取到的token写入对应存储：

具体步骤： #

• 获取扩展的背景页或弹出页的Page对象
• 在该页面执行脚本，将token写入扩展依赖的存储位置

示例代码：

const test = base.extend<{
    context: BrowserContext;
    extensionPage: Page;
}>({
    context: async ({ }, use) => {
        const pathToExtension = path.join("tests", "extension");
        const context = await chromium.launchPersistentContext("", {
            headless: false,
            args: [
                `--disable-extensions-except=${pathToExtension}`,
                `--load-extension=${pathToExtension}`,
            ]
        });
        await use(context);
        await context.close();
    },
    extensionPage: async ({ context }, use) => {
        // 获取扩展背景页（若扩展存在背景页）
        const backgroundPages = await context.backgroundPages();
        let extensionPage;
        
        if (backgroundPages.length > 0) {
            extensionPage = backgroundPages[0];
        } else {
            // 无背景页时，打开扩展弹出页/主页面
            const extensionId = "你的扩展ID"; // 可从chrome://extensions页面获取
            extensionPage = await context.newPage();
            await extensionPage.goto(`chrome-extension://${extensionId}/popup.html`); // 替换为你的扩展页面路径
        }

        // 写入token到chrome.storage.local（适配多数扩展的存储逻辑）
        await extensionPage.evaluate((token) => {
            return chrome.storage.local.set({ access_token: token });
        }, getToken());

        // 若扩展使用localStorage存储，替换为以下代码
        // await extensionPage.evaluate((token) => {
        //     localStorage.setItem('access_token', token);
        // }, getToken());

        await use(extensionPage);
        await extensionPage.close();
    }
})

2. 为什么extraHTTPHeaders无效？ #

• Playwright的extraHTTPHeaders仅对普通网页的请求生效，扩展的独立页面（chrome-extension://开头）请求不会继承该配置
• 扩展的运行上下文独立于普通页面，必须直接在扩展内部配置认证信息

3. 额外注意事项 #

• 需确认扩展实际存储token的键名（如access_token、auth_token），可通过浏览器开发者工具查看扩展的存储面板
• 确保写入的token格式与后端要求一致（比如是否需要Bearer 前缀）

内容的提问来源于stack exchange，提问作者Bharath Prasannakumar