使用javascript进行类似于DOM-capture的屏幕捕获？

Question

我正在开发一个web应用程序，我想对我们的用户如何实际使用我们的软件有一些第一手经验。这是我的想法：

*使用javascript保存html-DOM和cursor-position。可能只是对DOM的更改，以减少数据量。*将其与用户使用的浏览器一起保存到服务器。

根据记录更新DOM的javascript，以及在相应浏览器中复制鼠标移动的图像。

以前有人这样做过吗？这在大多数情况下都有效吗？

Answer 1

正如circle73所说，你可以使用HTML5通过画布来做这件事，然而，我不认为那会跟踪鼠标的位置。你可以编写一个JavaScript函数来每隔x秒跟踪鼠标坐标，你只需要用屏幕截图来计时，这样你就可以将鼠标的移动与捕捉到的帧进行匹配。

您的其他选择是通过此处回答的ActiveX控件来完成此操作：Take a screenshot of a webpage with JavaScript?

Answer 2

我将通过以下高级策略来实现这一点：

1. 使用jQuery mouseover记录用户在页面上的鼠标位置。将这些位置(x，y坐标)存储在本地。向您的服务器发送一个结构化的请求，使用这些coordinates.
2. Use浏览器自动化框架(如Selenium )来“播放”存储的坐标。您可以使用与您的用户相同的路径，仅在开发过程中，以便查看他所看到的内容。例如：

空mouseMove(WebElement toElement，long xOffset，long yOffset)

这将(从当前位置)移动到新坐标。这里有更多关于Selenium WebDriver页面的信息here.

• Take截图。更多信息here.