在 chrome 打包的应用程序中使用 javascript 截屏答案

【问题标题】：Taking screenshot using javascript in chrome packaged app在 chrome 打包的应用程序中使用 javascript 截屏
【发布时间】：2014-04-09 07:18:58
【问题描述】：

我需要在 chrome 打包的应用程序中获取当前的 html。我知道Taking screenshot using javascript for chrome extensions，但是当我尝试这个时，chrome 声明打包的应用程序不允许使用“tab”权限。

有什么方法可以可靠地抓取当前页面？

【问题讨论】：

【解决方案1】：

您无法使用打包的 Chrome 应用程序执行您想要执行的操作。相反，您可能应该考虑制作一个扩展程序，因为如果您想与当前页面进行交互，那将是一种方式。

如果您不确定，这里有一个资源可以帮助您准确确定应该选择什么：https://developer.chrome.com/webstore/choosing

【讨论】：

我和 rene_gr 有同样的问题，我不能使用扩展，因为我需要一个 webview（chrome 扩展 API 不支持）。
“不能做”，并不完全正确。有一些“古怪”的解决方法（几乎）可以满足我的要求。当您牢记注意事项时，您可以执行以下操作：将当前 html 状态转换为画布 -> html2canvas.hertzen.com，现在您可以将画布的内容转换为图像资源。现在取决于你，你想用它做什么。希望这会有所帮助。
@rene_gr 但这有点引出了一个问题，为什么要麻烦这么多——当然，做一个扩展来做这件事会更容易吗？
@Invictus 我不打算“扩展”浏览器。我正在自己构建一个独立的软件，它只是使用 chrome 桌面平台进行部署。在这种情况下，作为扩展部署将是不合适的。
@rene_gr 我明白 - Google 只是将这种类型的程序称为“扩展”。打包的应用程序旨在与网页隔离。这些名字是否特别合适是无关紧要的。

【解决方案2】：

不是来自 chrome 扩展，因为它们是以浏览器为中心的解决方案（不是以网页为中心的）。

Niklas Von Hurtzen 创建了一个非常有用的名为 html2canvas 的 js 扩展，它基本上可以满足您的需求，而不是作为 chrome 扩展。你可以看到它here。

“渲染”后，插件将通过遍历您交给扩展的任何内容的 DOM 树来创建画布元素。从那里开始很简单...yourRenderedCanvasElement.toDataUrl() 将返回一个 data: 该画布元素的 URL 表示，默认情况下是 PNG，为您提供“屏幕截图”。

编辑：哈，我现在看到你在另一个答案的消息线程中引用了这个确切的东西......

【讨论】：