网页的客户端屏幕截图

Question

我想使用我开发的外部插件捕获网页作为屏幕截图。我想在我的不同网站中使用这个插件来捕获屏幕并将其发送到我的其他域。目前我已经使用 html2canvas 插件来捕获屏幕截图，但它产生了 CORS 问题。

这意味着已通过身份验证的页面在执行此过程时需要新的身份验证。我还尝试了 html2canvas 中的 useCORS 选项，但问题仍未解决。以及渲染网页和截取页面的时间也太长。

如果我将 allowTaint 设为 true，它会成功捕获屏幕截图，但会创建受污染的画布，我想将其另存为我的服务器上的图像，因此请防止使用 toDataUrl 功能。

我尝试使用 puppeteer 截屏，但它在新的浏览器窗口中打开网页并截屏。尝试截取经过身份验证的页面的屏幕截图时会产生问题。

因为我在 puppeteer 中得到了很多解决方案，所以它第一次打开浏览器，用户必须登录那里将 cookie 保存为 json 并在下一个请求中发送。

但这不可能是我的解决方案。因为我想在可以在任何网站中使用的插件中使用此功能。

我也尝试使用 puppeteer 代码，但没有帮助我。

非常感谢任何建议或解决方案。谢谢。

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.screenshot({ path: 'example.png' });

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