Question

我想制作运行Chromecast设备的接收器应用程序的屏幕截图。我需要让它在设备上运行，以便一起显示视频和应用程序。

有办法做到这一点吗？

Answer 1

Ali Naddaf的答案在技术上是正确的，但是通过一些工作，我能够忠实地重建屏幕，以至于它与实际屏幕截图无法区分。

我们将使用html2canvas项目中的代码，请参阅http://html2canvas.hertzen.com/documentation.html。它会将我们的屏幕渲染到画布上。特别是，将已编译的代码从http://html2canvas.hertzen.com/build/html2canvas.js复制并粘贴到Chromecast控制台。（在dom中添加标签似乎不起作用）您可以访问Chromecast控制台＆amp;通过Chrome访问ip.ad.dr.ss：9222端口的开发人员工具。
发出以下命令：

html2canvas（document.body，{onrendered：function（canvas）{document.write（＆＃39;＆＃39;）;}}）;

这会破坏性地用屏幕截图替换屏幕（我发现这很方便，但如果你愿意，你可以轻松地想到更礼貌的方式）
在元素浏览器中，您将拥有一个img，其中base64 url被指定为src。点击网址，Chrome会在新标签页中打开图片。希望它是你想要的截图。
你可能会发现有些图片因为同源政策。除了从html访问图像之外，javascript还有其他权限。如果发生这种情况，请以某种方式解决（例如，使用https作为图像），然后转到1。
你有截图！

Answer 2

我正在将zsolt-szatmari的答案扩展到可以在Chromecast开发人员工具控制台中使用的可复制的脚本：

正如他所说，将http://html2canvas.hertzen.com/build/html2canvas.js代码复制并粘贴到控制台
调用html2canvas方法：它将在DOM中创建一个新的canvas元素：html2canvas(document.body, { onrendered: function(canvas) { document.body.appendChild(canvas); } });。
获取当前显示在画布中的图像的base64字符串表示形式：document.getElementsByTagName('canvas')[0].toDataURL('image/png');

然后，您将获得一个非常长的base64字符串：如果您点击它，Chrome将在新标签中显示该图片。请注意，由于html2canvas限制，此图片可能远离Chromecast上显示的图片：

屏幕截图基于DOM，因此可能不是100％准确到真实的表示，因为它没有实际截图，但根据信息构建屏幕截图可在页面上找到。

（source）

Answer 3

不，由于媒体权利和安全等诸多原因，这是不可能的。

Answer 4

我原以为你可以使用它来将画布捕获到一个图像文件，它通常在带有画布的javascript中运行：

var canvas = document.getElementById("mycanvas");
var img = canvas.toDataURL("image/png");

当然，您需要将此图像文件传输到某处 - 不确定如何从chromecast中获取最后一位。也许这是不可能的。

作为一名Chromecast开发人员，我需要运行应用程序的屏幕截图来向客户展示。我最终做了一种＆＃34;模拟＆＃34; chromecast的一部分 - 在javascript中调用一些模型方法来显示数据，然后通过浏览器桌面上的cast url访问我的接收器应用程序。然后我使用屏幕捕获程序来捕获浏览器输出。这给了我与在电视上的chromecast上运行接收器应用程序相同的屏幕截图，这实际上只是一个显示你的html + css + javascript接收器的浏览器。

如何在chromecast上制作截图？

4 个答案: