使用JavaScript截取网页截图？

Question

是否可以使用JavaScript获取网页的屏幕截图,然后将其提交回服务器？

我不太关心浏览器安全问题.因为实施将是HTA.但这可能吗？

Answer 1

Google正在Google+中这样做,而且一位才华横溢的开发人员对其进行了反向设计,并制作了http://html2canvas.hertzen.com/.要在IE中工作,您需要一个画布支持库,例如http://excanvas.sourceforge.net/

Answer 2

我通过使用ActiveX控件为HTA做了这个.在VB6中构建控件以获取屏幕截图非常容易.我不得不使用keybd_event API调用,因为SendKeys无法执行PrintScreen.这是代码:

Declare Sub keybd_event Lib "user32" _
(ByVal bVk As Byte, ByVal bScan As Byte, ByVal dwFlags As Long, ByVal dwExtraInfo As Long)

Public Const CaptWindow = 2

Public Sub ScreenGrab()
   keybd_event &H12, 0, 0, 0
   keybd_event &H2C, CaptWindow, 0, 0
   keybd_event &H2C, CaptWindow, &H2, 0
   keybd_event &H12, 0, &H2, 0
End Sub

这只会让你获得窗口到剪贴板.

另一个选择,如果您想要截图的窗口是HTA,则只需使用XMLHTTPRequest将DOM节点发送到服务器,然后在服务器端创建屏幕截图.

Answer 3

我发现的另一个可能的解决方案是http://www.phantomjs.org/,它允许人们非常轻松地截取页面的屏幕截图以及更多内容.虽然我对这个问题的原始要求不再有效(不同的工作),但我可能会将PhantomJS整合到未来的项目中.

Answer 4

Pounder是否可以通过将整个身体元素设置为画布然后使用canvas2image来实现？

http://www.nihilogic.dk/labs/canvas2image/

Answer 5

一种可行的方法,如果在Windows上运行并安装了.NET,您可以:

public Bitmap GenerateScreenshot(string url)
{
    // This method gets a screenshot of the webpage
    // rendered at its full size (height and width)
    return GenerateScreenshot(url, -1, -1);
}

public Bitmap GenerateScreenshot(string url, int width, int height)
{
    // Load the webpage into a WebBrowser control
    WebBrowser wb = new WebBrowser();
    wb.ScrollBarsEnabled = false;
    wb.ScriptErrorsSuppressed = true;
    wb.Navigate(url);
    while (wb.ReadyState != WebBrowserReadyState.Complete) { Application.DoEvents(); }


    // Set the size of the WebBrowser control
    wb.Width = width;
    wb.Height = height;

    if (width == -1)
    {
        // Take Screenshot of the web pages full width
        wb.Width = wb.Document.Body.ScrollRectangle.Width;
    }

    if (height == -1)
    {
        // Take Screenshot of the web pages full height
        wb.Height = wb.Document.Body.ScrollRectangle.Height;
    }

    // Get a Bitmap representation of the webpage as it's rendered in the WebBrowser control
    Bitmap bitmap = new Bitmap(wb.Width, wb.Height);
    wb.DrawToBitmap(bitmap, new Rectangle(0, 0, wb.Width, wb.Height));
    wb.Dispose();

    return bitmap;
}

然后通过PHP你可以做到:

exec("CreateScreenShot.exe -url http://.... -save C:/shots domain_page.png");

然后你在服务器端有截图.

Answer 6

这对您来说可能不是理想的解决方案,但它仍然值得一提.

Snapsie是一个开源的ActiveX对象,可以捕获和保存Internet Explorer截图.一旦DLL文件在客户端上注册,您应该能够捕获屏幕截图并使用JavaScript将文件上传到服务器.缺点:它需要在客户端注册DLL文件,并且只能与Internet Explorer一起使用.

Answer 7

我们对报告错误有类似的要求.由于它是用于Intranet场景,我们能够使用浏览器插件(如Firefox的Fireshot和Internet Explorer的IE屏幕截图).

Answer 8

这个问题很老了，但也许仍然有人对最先进的答案感兴趣：

您可以使用getDisplayMedia：

https://github.com/ondras/browsershot