使用 JavaScript 截取网页的屏幕截图?

IT技术 javascript hta webpage-screenshot
2021-01-22 10:16:14

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

我不太关心浏览器的安全问题。等等,因为实现将用于HTA但有可能吗?

6个回答

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

谢谢,您帖子中的链接很好地解释了一切
2021-04-03 10:16:14

我已经通过使用 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 节点发送到服务器,然后在服务器端创建截屏。

我同意 Allen 的观点,这是一种可能对页面进行截图的巧妙方法!
2021-03-14 10:16:14
请问什么是“HTA”?
2021-03-18 10:16:14
@PeteAlvin HTA 是一个超文本应用程序,它是一种在 Internet Explorer 中运行特权 JS 应用程序的方法。今天不是超级相关。
2021-03-23 10:16:14

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

你知道phantomjs能不能在页面(不是整个页面)上生成一个元素的图片吗?
2021-03-31 10:16:14
是的你可以。无论是使用这个片段与PhantomJS或使用CasperJS
2021-04-04 10:16:14

Pounder 是否可以通过将整个身体元素设置为画布然后使用 canvas2image 来做到这一点?

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

想知道 SVG 是否有帮助,可能需要查看 Google 的来源
2021-03-29 10:16:14
您可以使用 Niklas 的 html2canvas 代码在画布中渲染 html,然后使用它来保存图像。
2021-04-06 10:16:14

一种可能的方法是,如果在 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");

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

虽然与问题略有关系,但这是一个很棒的建议!谢谢 !
2021-03-21 10:16:14
为什么它不加载一些样式,甚至我可以在 IE9 中看到它们加载?!
2021-04-02 10:16:14