javascript - 如何从网址截取网页快照？

Question

我想从 url 截取网页快照。 url是一个动态的html网页。基本上我们需要该网页的 img。

我想在 C# 中将 html 页面转换为图像，但没有成功。我首先使用 streamreader 读取 html，并使用 NReco.ImageGenerator 尝试转换为字节，最后转换为图像。这是行不通的。最后，我尝试使用 html 网页内部的 javascript 将 html 转换为 Canvas 。

function report() {
let region = document.querySelector("body");
 html2canvas(
 $('body'),
 {allowTaint: true, logging: true,'onrendered': function (canvas) 
 {}}).then( //getting problem here at then
 function (canvas) {
 let jpgUrl = canvas.toDataURL();
  console.log(jpgUrl);
  var text = "bottom-right Brochure1";
 var imageName = text + '.jpg';
 download(jpgUrl,imageName, "image/png");
 }

代码解释 - 它将使用 js 对 html 页面中的 body 元素进行快照。获取 url 并从 url 创建 Canvas 。并自动下载。但我面临一个问题 ------ “html2canvas(...),then 不是一个函数”.. 我不知道为什么会这样。请帮忙。

Answer 1

由于所有现代浏览器中的跨源资源共享 (CORS) 限制，这不能完全在客户端完成。您需要在服务器端执行此操作。要在服务器上使用 javascript 执行此操作，请使用 NodeJS，有几个 npm 包可以提供帮助，例如:node-server-screenshot、PhantomJS 等