我试图让我网站上的用户按下一个按钮来截取当前屏幕的屏幕截图(正文中的所有内容)。
根据我的研究,html2canvas 似乎是一种使这成为可能的资源。
我的问题是文档没有提供示例代码,我很难掌握所涉及的步骤。
http://html2canvas.hertzen.com/documentation.html
以下 SO 问题 ( How to upload a screenshot using html2canvas? ) 让我有点困惑。我现在只想知道如何获取图像。
来自他的代码。
$(window).ready(function(){
('body').html2canvas();
var canvasRecord = new html2canvas(document.body).canvas;
//At this point does the .toDataURL method return a png?
});
在这一点上,我迷失了图像的位置,甚至不知道如何/何时创建它。我担心稍后将其发送到服务器。
任何信息表示赞赏。谢谢! (甚至需要 html2canvas?)
最佳答案
当您使用 html2canvas jQuery 插件时,这里有一个示例片段
var screenshot;
$('body').html2canvas({
onrendered: function(canvas) {
screenshot = canvas.toDataURL();
//code to process/send the image to server
}
});
在上面的代码片段中,html2canvas 创建了页面的屏幕截图。
您还可以使用 PhantomJS 创建网页的屏幕截图 - 前提是它们是公共(public)页面,因为您可能无法访问服务器端的登录保护页面;在这种情况下,只有像 html2canvas 这样的客户端解决方案才能工作。
关于javascript - 使用 html2canvas 截取 <body> 的屏幕截图并将图像存储为 JS var,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10401350/