如何在无URL情况下使用Puppeteer访问localStorage？

好问题！你遇到的权限拒绝错误确实是因为直接用page.setContent()加载HTML时，页面处于about:blank的无origin状态——浏览器的同源策略要求localStorage必须在拥有有效源（origin）的文档环境下才能访问。

幸运的是，你完全不需要依赖现有可访问的外部URL（甚至不需要启动本地服务器）就能解决这个问题，下面是两种可靠的方案：

方案1：导航到本地占位URL（最推荐） #

你可以先让页面导航到http://localhost这个本地地址，即使没有实际的服务器在运行这个端口，Puppeteer会请求失败，但页面依然会被赋予http://localhost的origin。之后再注入你的HTML内容，就能正常使用localStorage了：

// 先导航到localhost，无需服务器运行，请求失败也没关系
await page.goto('http://localhost', { waitUntil: 'fail' });
// 注入你的HTML内容
await page.setContent(`
  <html>
    <script>
      // 现在可以正常访问localStorage了
      localStorage.setItem('testKey', 'testValue');
      console.log(localStorage.getItem('testKey'));
    </script>
  </html>
`);

这里的waitUntil: 'fail'选项会让goto方法在请求失败后立即继续执行，避免不必要的等待。

方案2：通过脚本注入修改文档origin（hack方式，不推荐） #

如果你不想执行goto操作，可以通过在页面初始化时注入脚本，手动改写document.origin的取值：

// 在页面初始化时注入脚本，修改origin的获取逻辑
await page.evaluateOnNewDocument(() => {
  Object.defineProperty(document, 'origin', {
    get: () => 'http://localhost',
    configurable: true
  });
});
// 注入你的HTML内容
await page.setContent(`
  <html>
    <script>
      localStorage.setItem('testKey', 'testValue');
      console.log(localStorage.getItem('testKey'));
    </script>
  </html>
`);

不过这种方法属于对浏览器原生API的hack，可能在不同Puppeteer或Chrome版本中出现兼容性问题，因此优先推荐第一种方案。

总结一下：只要让页面获得一个有效的origin（哪怕是一个不存在的本地URL），就能绕过about:blank的限制，无需依赖现有可访问的外部URL即可使用localStorage。

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