Click here to Skip to main content
Click here to Skip to main content

Capture Entire Web Page

By , 15 Aug 2007
 


Screenshot - gui2_animated.gif

Update

- 08.15.2007 - user defined image formats, save path, base file name, text overlay/watermark, and screen res guidelines... and some other ideas to implement.

Introduction

I have seen other articles that describe how to accomplish this, but had no luck in getting any to work with Internet Explorer 7. This is a simple example that captures a webpage, inlcuding elements below the fold, and saves it as an image. Here is what to expect:

Screenshot - httpwwwcodeprojectcom.png
Note that this has been resized, captured images are actual size.

Using the code

This example includes only the basics. Images are saved as PNG's in the same directory as the exe. Saving as a different image format, variable pausing, and given filename should be relatively easy to add.

Private Sub GetImage()
    If WebBrowser1.Document Is Nothing Then
        Return
    End If
    Try
        Dim scrollWidth As Integer
        Dim scrollHeight As Integer
        scrollHeight = WebBrowser1.Document.Body.ScrollRectangle.Height
        scrollWidth = WebBrowser1.Document.Body.ScrollRectangle.Width
        WebBrowser1.Size = New Size(scrollWidth, scrollHeight)
        Dim bm As New Bitmap(scrollWidth, scrollHeight)
        WebBrowser1.DrawToBitmap(bm, New Rectangle(0, 0, bm.Width, bm.Height))
        Dim SaveAsName As String
        SaveAsName = Regex.Replace(textWebURL.Text, "(\\|\/|\:|\*|\?|\""|\<|\>|\|)?", "")
        bm.Save(SaveAsName & ".png", System.Drawing.Imaging.ImageFormat.Png)
        bm.Dispose()
    Catch ex As Exception
        MessageBox.Show(ex.Message, "Exception", MessageBoxButtons.OK, MessageBoxIcon.Error)
    Finally
        '
    End Try
    buttonCapture.Enabled = True
End Sub

Points of Interest

Waiting a second or two after the document has loaded will allow that much more of the client-side animation / js / etc. to be captured. If the web page is saved as a "white" image, try the above.

Environment

Vista / VS2005

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

About the Author

daniel.esquivias
United States United States
Member

Sign Up to vote   Poor Excellent
Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

 
You must Sign In to use this message board.
Search this forum  
    Spacing  Noise  Layout  Per page   
QuestionVERY SKINNY Image createdmemberRon Mittelman25 Oct '11 - 9:33 
Running both of the projects supplied, without any changes, causes the same effect: I can see the full height of the CodeProject web site, but it is very skinny. You can just about see half of the "W" in "Welcome to the Code Project".
 
Any idea why the width is so small?
 
Also, is there a way to capture an existing IE browser window instead of opening a new one and navigating to a site? My project needs that ability. Can anybody suggest code to do that?
 
Thanks...
AnswerRe: VERY SKINNY Image createdmemberRon Mittelman25 Oct '11 - 9:55 
I figured out one way to fix this (sort of):
In the GetImage method, I added "* 15" to the statement which sets the scroll width.
 
I have no idea whether that is a good way to fix this or not.
 
Still, question remains:
 
Can somebody help a newbie to adapt this code to use an existing IE window instead of a browser control on a form?
 
I have an existing ASP.NET application which opens up a print preview browser window containing all information that they had entered in the application. I need to capture the entire print preview into an image file of some type.
 
If this can be adapted to an open IE window, that would solve my problem. The only identifying characteristic is that the window title is "Print Preview - Windows Internet Explorer" I THINK I can use the FindWindow API to get that browser window, but not sure how. Can the code from this article apply to a .NET WebBrowser object rather than a browser control on a windows form?
 
Thanks
GeneralDoesn't seem to work on a page with JScript or ActiveXmemberSteve Dunn22 Jun '10 - 7:37 
Hi,
Nice project, but sadly doesn't work with pages that have a lot of script or Active X controls. I haven't found one free control that can do this, so you're not on your own.
 
To prove, try capturing yahoo.com
 
Cheers,
 
Steve
There are 10 types of people in this world. Those that understand binary, and those that don't.

GeneralProblem with DrawToBitmapmemberchurchillr22 Apr '10 - 9:36 
I've been working on a similar project, and have found a couple of solutions. But neither of them is 100% reliable.
 
Problem #1: WebBrowser.DrawToBitmap
Fails to render bitmap for some sites (yahoo, paypal, etc.) This is a known problem, which Microsoft says it will not fix because DrawToBitmap is not actually a public member of the bitmap class.
Therefore, DrawToBitmap is not a viable solution for a commercial-level product.
 
Problem #2: Graphics.CopyFromScreen
This method works great for creating Thumbnails, but it is not capable of capturing full-sized screenshots. CopyFromScreen will only capture the content which is visible on the screen. If the page requires scrolling, or is partially obscured it will not render that portion of the image.
 
At this point, I'm looking into a solution that implements the appropriate WIN32 API calls, as the .net framework doesn't seem to have the power to accomplish this task in a reliable fashion.
QuestionMultiple Pages TIFFmemberdamifoo17 Mar '09 - 20:40 
Thanks for the superb code. I was trying to figure out on how to go about breaking into multiple pages for TIFF if my HTML source detects a <br style="page-break-before: always;" />
 
Thanks in advise.
QuestionHow can I read the screen textmembermoreed10 Feb '09 - 20:30 
I am using visual basic 6 and I need a way to read internet explorer text or word text or any text that drawn on the forms with TextOut od vb labels
and many thanks to the replyers and the developers of the site
-------
Sorry for my English I am not English man
QuestionCan i plot this into asp.net web page?membercavinsnipes25 Sep '08 - 2:01 
This is great but can it be integrated to a web page?
 
like a button with a define path... to save the page as image?
Generaldoesn't convert big filemembershob_sp16 Jun '08 - 1:24 
it creats a image file of small html page. but when the file is very big its create half black screen. can u help me out.
 
gtytjuyju

Generalhtml to imagememberrejaneesh7 May '08 - 19:45 
I need to convert html to image. I tried your code .Its working properly.
Thank you so much for providing this helpful code.
 
I am trying to develop the same in C#.net Web Application. If you have any suggessions or hints ,plz help me...
 
Thanks...Rose | [Rose]
GeneralNot capturing whole pagememberjfarias6 May '08 - 5:45 
I am using parts of your code in an application to create a powerpoint presentation. When I run your code and my code the height of the documents aren't the same. In my code it is smaller which cuts off the picture, in your code it doesn't. I've set a breakpoint at:
scrollHeight = formDefault.WebBrowser1.Document.Body.ScrollRectangle.Height and
scrollWidth = formDefault.WebBrowser1.Document.Body.ScrollRectangle.Width.
 
I am stumped as to why in different apps the height comes up different, thought the widths are the same. I've gone through both pieces of code and stepped through and can't seem to find anything different. Would you happen to have any ideas?
 
thanks,
 
jeff.Confused | :confused:

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Permalink | Advertise | Privacy | Mobile
Web04 | 2.6.130523.1 | Last Updated 16 Aug 2007
Article Copyright 2007 by daniel.esquivias
Everything else Copyright © CodeProject, 1999-2013
Terms of Use
Layout: fixed | fluid