Playwright:无法从窗口读取localStorage属性:对此文档的访问被拒绝

基础概念

Playwright 是一个用于自动化浏览器的库，支持多种浏览器（如 Chrome、Firefox、Safari）。它允许开发者编写测试脚本，模拟用户操作，进行网页自动化测试。

问题原因

当你尝试从窗口读取 localStorage 属性时，如果出现“对此文档的访问被拒绝”的错误，通常是因为浏览器的安全策略限制了对 localStorage 的访问。这可能是由于以下原因：

1. 跨域限制：如果页面是跨域加载的，浏览器可能会阻止对 localStorage 的访问。
2. 权限问题：某些浏览器扩展或设置可能会限制对 localStorage 的访问。
3. 浏览器安全策略：某些浏览器模式（如隐私模式）可能会限制对 localStorage 的访问。

解决方法

1. 确保页面在同一域下

确保你要访问 localStorage 的页面和脚本在同一域下。如果页面是跨域加载的，可以考虑使用 postMessage 进行跨域通信。

2. 检查浏览器扩展和设置

确保没有安装可能限制 localStorage 访问的浏览器扩展。同时，检查浏览器的隐私设置，确保没有启用过于严格的隐私保护模式。

3. 使用 Playwright 的 context 和 page

在 Playwright 中，可以使用 context 和 page 对象来管理浏览器会话和页面。以下是一个示例代码，展示如何在 Playwright 中安全地访问 localStorage：

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const context = await browser.newContext();
  const page = await context.newPage();

  // 导航到目标页面
  await page.goto('https://example.com');

  // 设置 localStorage
  await page.evaluate(() => {
    localStorage.setItem('key', 'value');
  });

  // 读取 localStorage
  const value = await page.evaluate(() => {
    return localStorage.getItem('key');
  });

  console.log(value); // 输出: value

  await browser.close();
})();

4. 处理权限问题

如果是因为权限问题导致的访问被拒绝，可以尝试在启动浏览器时禁用某些安全策略。例如，在启动 Chrome 时添加 --disable-web-security 标志：

const browser = await chromium.launch({
  args: ['--disable-web-security']
});

参考链接

• Playwright 官方文档
• Playwright GitHub 仓库

通过以上方法，你应该能够解决“无法从窗口读取 localStorage 属性:对此文档的访问被拒绝”的问题。