网页快照几种实现方案参考 (一)、HTML转图片1.使用 html2canvas 制作网页快照（1）介绍官网： https://html2canvas.hertzen.com/Html2canvas是一个JS库，通过在web引入JS的方式，点击按钮后可以根据ID呼叫需要制作快照的标签，会根据标签制作成图片。（2）使用方法如需要制作快照的html为：<div id="capture" style="padding: 10px; background: #f5da55"> <h4 style="color: #000; ">Hello world!</h4></div>那么使用html2canvas 制作快照只需要html2canvas(document.querySelector("#capture")).then(canvas => { document.body.appendChild(canvas)});（3）特征其支援的WebBrowser包含Firefox 3.5+Google ChromeOpera 12+IE9+Safari 6+优点：支援的WebBrowser较多，使用比较方便，只需要引入一个JS即可缺点：需要根据ID制作快照2.使用wkhtmltoimage 制作网页快照（1）介绍官网：https://wkhtmltopdf.org/wkhtmltoimage是一个独立的程序，和wkhtmltopdf属于同一个程序中，支援Windows、Ubuntu、Centos、Debian、MacOS等主流操作系统，安装完毕之后使用十分方便，只需要一个url即可制作成快照图片或者pdf。（2）使用方法使用简单，只需要一个可以访问的url即可wkhtmltoimage http://openclever.pro/OpenRich/admin/login.aspx login.pngWkhtmltoimage [要制作快照的url] [输出档的路径]完整中文参数详解在：https://note.coccoo.cc/Archive/wkhtmltopdforimage_params_zh.html（3）特征优点：使用十分方便，支援的操作系统较多缺点：需要使用可以直接访问的url（如果需要登陆的页面可能无法拍快照）3.使用WebSiteThumbnail制作网页快照（C#）（1）介绍使用WebSiteThumbnail.cs制作网页快照，把这个class放入C#项目中，然后直接呼叫GetWebSiteThumbnail这个Function就可以制作快照图片。WebSiteThumb.cs下载（2）使用方法 //在任意网页中的Page_Load事件时，加入如下代码： protected void Page_Load(object sender, EventArgs e) { Bitmap m_Bitmap = WebSiteThumbnail.GetWebSiteThumbnail("http://www.google.cn", 600, 600, 600, 600); MemoryStream ms = new MemoryStream(); m_Bitmap.Save(ms, System.Drawing.Imaging.ImageFormat.Png);//JPG、GIF、PNG等均可 byte[] buff = ms.ToArray(); Response.BinaryWrite(buff); }（3）特征优点：C#语言，可以融入项目中缺点：没来得及测试，暂不清楚效果如何（二）、存储当前网页的Coding版本渲染1.使用保存Html源码的形式制作快照（1）介绍把整个html的源代码（包含所有html、js和css）保存下来，类似于在浏览器中Ctrl+S存储为 .html 的档案，命名为 文件名-版本号.html，如 detail-26018.html，这样只需要记录版本号 26018 就可以找到对应的文件名称，直接展示即可作为快照使用。（2）使用方法把渲染出来的画面直接保存为 xxx-version.html ，需要查看快照的时候直接展示在浏览器即可。（3）特征优点：便于存储和管理，可以还原成页面原本的样子缺点：存储大量档可能会导致服务器缓慢，可以不存在DB而是存于io中，DB直接保存io的位置即可