Microsoft Most Valuable Professional

Chris Pietschmann

An MVP From Wisconsin



C#: Generate WebPage Thumbmail Screenshot Image

There are a few services out there that serve up screenshots of any webpage for you to display on your website. One popular one is Kwiboo; this is the one that DotNetKicks uses. For some time now I've wondered what the easiest way to do this in .NET was, and today I stumbled upon the undocumented WebBrowser.DrawToBitmap method that makes this extremely easy to do.

By the way, I stumbled upon the WebBrowser.DrawToBitmap while taking a look at the source code for the WebPreview tool over at SmallSharpTools.com.

Here's a sample method that returns a Bitmap representation of a webpage:

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;
}

Here are some example usages of the above method:

// Generate thumbnail of a webpage at 1024x768 resolution
Bitmap thumbnail = GenerateScreenshot("http://pietschsoft.com", 1024, 768);

// Generate thumbnail of a webpage at the webpage's full size (height and width)
thumbnail = GenerateScreenshot("http://pietschsoft.com");

// Display Thumbnail in PictureBox control
pictureBox1.Image = thumbnail;

/*
// Save Thumbnail to a File
thumbnail.Save("thumbnail.png", System.Drawing.Imaging.ImageFormat.Png);
*/

Currently rated 5.0 by 4 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Categories: asp.net | General
Posted by crpietschmann on Wednesday, July 23, 2008 9:43 PM
Permalink | Comments (13) | Post RSSRSS comment feed

Related posts

Comments

Miron il

Friday, July 25, 2008 7:26 AM

Miron

Can your code run on asp.net site? or only on Winform app ?

tobsen

Friday, July 25, 2008 9:53 AM

tobsen

hmm.. this does not run in a console app.

Chris Pietschmann us

Friday, July 25, 2008 11:48 AM

Chris Pietschmann

Yes this can be done in an ASP.NET website. In fact Brennan's code over at SmallSharpTools.com has a sample web project that implements it.
I recommend you go download the code over at SmallSharpTools.com:
http://smallsharptools.com/Projects/WebPreview/

Also, I don't see why this wouldn't work in a Console App, but I haven't tried it myself yet.

Miron il

Friday, July 25, 2008 11:56 AM

Miron

@Chris,
Thanks for your reply. As I accepted, the web solution you pointed at (SmallSharpTools) suffer from the same problem
I had when I did the same few month ago. Lots of sites just appear as white square.
try http://yahoo.com.

Miron il

Friday, July 25, 2008 11:58 AM

Miron

Sorry, I wanted to say: As I suspected...

swanky.wu cn

Friday, July 25, 2008 10:58 PM

swanky.wu

@tobsen

add System.Drawing and System.Windows.Forms reference to your project
you need to add those DLL also.

Busby Seo Challenge us

Thursday, August 28, 2008 11:12 PM

Busby Seo Challenge

Nice post good luck, I am amaze to your post.

Patric se

Wednesday, September 10, 2008 3:31 AM

Patric

Hi,

Is there any way to capture the browser window so you can get the rendering view from say, IE, Firefox and Opera?
Like http://browsershots.org/ does it.

And it be really nice if it's able to run as a Windows service or in ASP.NET

/Patric

code-inside.de

Thursday, September 11, 2008 2:50 AM

pingback

Pingback from code-inside.de

HowTo: Dynamisch Webseiten-Screenshots erzeugen | Code-Inside Blog

Chris Pietschmann us

Friday, September 12, 2008 10:17 PM

Chris Pietschmann

The code in this post doesn't open a browser window, so that'd be why it doesn't provide the browser window or "chrome" graphics around the edge of the screenshots. To take a screenshot of the entire browser window (including its chrome) you'd have to open an instance of the browser and then take a screenshot of that windows using the Windows API's. I don't have a code snippet for this, but if anyone else does, please feel free to post it.

amrelgarhy eg

Saturday, September 13, 2008 5:56 PM

amrelgarhy

When i give it this URL http://www.yahoo.com its not working, not giving a screen shot, also http://www.googl.com, can you help me with the reason and how to solve

Somdutta Roy in

Sunday, September 14, 2008 3:11 PM

Somdutta Roy

Wow, this article is a great one, i was always a native code programmer and recently am trying out the managed coding things and i must say managed coing makes quite a few seemingly difficult things in unmanaged codes really simpler

Gillian Riddoch gb

Wednesday, October 15, 2008 12:16 PM

Gillian Riddoch

Fantastic!!!
I have struggled all day with HttpWebRequests that kept throwing Parameter not valid errors when I tried to load the Image from a Datastream. This worked first time, no problems!!! MANY THANKS!!!

Comments are closed

About the author

I'm Chris Pietschmann, go to the About Me page to learn more about me.

Search

Sponsors

Web.Maps.VE - ASP.NET AJAX Virtual Earth Mapping Server Control

Recent comments

Disclaimer


This work is licensed under a Creative Commons Attribution 3.0 United States License, unless explicitly stated otherwise within the posted content.
© Copyright 2004 - 2008 Chris Pietschmann