我有一个页面，我们在其中使用CSS定位一堆元素，并使用JS更改它们的“顶部和左侧”位置。
我有报道说这些东西没有对齐，但是用户有动机撒谎说“欺骗”，所以我不确定他们是否在说真话。我试图找到一种方法来弄清楚他们是否在撒谎，并提供一些“证据”。
我知道Canvas具有从图像元素或另一个canvas元素（一种BitBlt操作）复制图像信息的方法。
是否可以通过Canvas（或其他方式，Flash，随便什么）以某种方式拍摄页面的“图片”？
再一次，我不是要从中获取信息<image>。我正在尝试复制用户看到的内容，它由几个绝对定位的HTML元素组成（我最关心这些位置），并以某种方式将其上传到服务器。
我知道这无法完成，但也许我遗漏了一些东西。
有任何想法吗？
Answers:
之前有人问过一个与此类似的问题。滚动到Youtube的底部，然后单击“报告错误”链接。Google的反馈工具（由JavaScript驱动）基本上可以完成您所描述的工作。从我对代码的了解来看，它使用画布，并且具有基于JavaScript的JPEG编码器，该编码器构建JPG图像发送给Google。
肯定会有很多工作要做，但我相信您可以完成类似的工作。
如果可以选择商业解决方案，请签出SnapEngage。单击右上角的“帮助”按钮以查看其运行情况。这是屏幕截图：-
设置非常简单，您只需要复制并粘贴几行JavaScript代码即可。
SnapEngage使用Java Applet截屏，这是有关其工作原理的博客文章。
是的，您可以看到以下演示在下面的代码中，我已经在body标签内定义了表格，但是当您运行此代码时，它将显示图像快照。
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>test2</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script>
<script type="text/javascript" src="js/html2canvas.js?rev032"></script>
<script type="text/javascript">
$(document).ready(function() {
var target = $('body');
html2canvas(target, {
onrendered: function(canvas) {
var data = canvas.toDataURL();
alert(data);
document.body.innerHTML="<br/><br/><br/><br/><br/><br/><img src="+data+" />";
}
});
});
</script>
</head>
<body>
<h1>Testing</h1>
<h4>One column:</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
</body>
html2canvas官方文档：- http://html2canvas.hertzen.com/
要下载html2canvas.js库，如果无法从官方链接中找到您也可以使用它：-https: //github.com/niklasvh/html2canvas/downloads [我对此链接不承担任何责任：P：P：P]
您可以使用Firefox当前仅支持的element。
background: -moz-element(#mysite);
这#mysite是其内容用作背景的元素
在Firefox中打开：http ：//jsfiddle.net/qu2kz/3/（在FF 27上测试）
canvas.toDataURL()方法返回的base64编码字符串轻松保存或将图像发送回服务器。如果有好消息出现，我会继续努力，并让您知道。
我认为您无法做到。但是，你可以递归获取clientHeight，clientWidth，offsetTop并offsetLeft确定页面上的所有元素的位置，并将其发送回服务器。
在Firefox上，您可以创建一个使用canvas.drawWindow将Web内容绘制到画布上的插件。 https://developer.mozilla.org/en/Drawing_Graphics_with_Canvas#Rendering_Web_Content_Into_A_Canvas
我认为目前尚无办法在WebKit上做到这一点。
可以做到，但有一些限制。有一些技术，而这些技术恰好是多少扩展程序可以截屏。从您的描述看来，您并不是在寻找要部署的通用客户端解决方案，而只是一个用户或某些用户可以使用并提交的东西，因此我想使用扩展会很好。
铬：
我可以将您指向我的开源Chrome扩展程序Blipshot，它确实做到了：https : //github.com/folletto/Blipshot
仅给出一些背景：
chrome.tabs.captureVisibleTab并且需要从清单访问选项卡。Firefox：
在Firefox自1.5开始，您可以构建使用canvas自定义扩展名的扩展名，该扩展名drawWindow比chrome.tabs.captureVisibleTabChrome强大。一些信息在这里：https :
//developer.mozilla.org/en/Drawing_Graphics_with_Canvas