Skip to main content

How To Export WebPage as Image in asp..net

In this post i will show how to export Webpage as image in asp.net
  1. Start Visual Studio 2005.
  2. Create a Web site.
  3. Add Reference of System.Windows.Forms
  4. Add AspCompat="true" in page attribute.
  5. Verify that the following namespaces are included in the ExportWebPageToImage.c
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Drawing;
using System.Drawing.Imaging;
using System.Windows.Forms;
Here is complete source code
<%@ Page Language="C#" AspCompat="true" AutoEventWireup="true" CodeFile="ExportWebPageToImage.aspx.cs"
   Inherits="ExportWebPageToImage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title></title>
   <style type="text/css">
       .style1
       {
           width: 100%;
       }
   </style>
</head>
<body>
   <form id="form1" runat="server">
   <div>
       <asp:TextBox ID="txtUrl" runat="server" Width="208px"></asp:TextBox><br />
       <asp:Button ID="btnConvert" runat="server" Text="Convert Page To Image" OnClick="btnConvert_Click" />
   </div>
   </form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Drawing;
using System.Drawing.Imaging;
using System.Windows.Forms;

public partial class ExportWebPageToImage : System.Web.UI.Page
{
   protected void Page_Load(object sender, EventArgs e)
   {


   }

   public System.Drawing.Bitmap CaptureWebPage(string URL)
   {
       // create a hidden web browser, which will navigate to the page
       System.Windows.Forms.WebBrowser web = new System.Windows.Forms.WebBrowser();
       // we don't want scrollbars on our image
       web.ScrollBarsEnabled = false;
       // don't let any errors shine through
       web.ScriptErrorsSuppressed = true;
       // let's load up that page!
       web.Navigate(URL);

       // wait until the page is fully loaded
       while (web.ReadyState != WebBrowserReadyState.Complete)
           System.Windows.Forms.Application.DoEvents();
       System.Threading.Thread.Sleep(1500); // allow time for page scripts to update
       // the appearance of the page

       // set the size of our web browser to be the same size as the page
       int width = web.Document.Body.ScrollRectangle.Width;
       int height = web.Document.Body.ScrollRectangle.Height;
       web.Width = width;
       web.Height = height;
       // a bitmap that we will draw to
       System.Drawing.Bitmap bmp = new System.Drawing.Bitmap(width, height);
       // draw the web browser to the bitmap
       web.DrawToBitmap(bmp, new System.Drawing.Rectangle(0, 0, width, height));

       return bmp; // return the bitmap for processing
   }
   protected void btnConvert_Click(object sender, EventArgs e)
   {
       Bitmap bitmap = new Bitmap(CaptureWebPage(txtUrl.Text));
       Response.ContentType = "image/jpeg";
       bitmap.Save(Response.OutputStream, ImageFormat.Jpeg);
       bitmap.Dispose();
       bitmap.Dispose();
       Response.End();
   }
}

Comments

  1. below is what i can see, by using your code...could you please tell me why ?

    Navigation to webpage cancelled

    ReplyDelete
  2. Disabling the firewall fixed the problem. For more details check out this link
    http://channel9.msdn.com/forums/TechOff/253431-WebBrowser-Ctrl-in-MFC/

    ReplyDelete
  3. How it can work for website?

    ReplyDelete
  4. Hm, throws an error 'txtUrl' is not declared. It may be inaccessible due to its protection level

    ReplyDelete
  5. Oh gesh, I forgot the text box. Ok, it doesn't error, but doesn't do anything either. Takes a few seconds, looks like it's posting back, then nothing happens. What am I doing wrong? Where is it saving the image?

    ReplyDelete
  6. It will display on the page.

    ReplyDelete
  7. @harri:replace the following method call,currently I am saving output in response stream.

    bitmap.Save(Response.OutputStream, ImageFormat.Jpeg);

    ReplyDelete
  8. I'm going to use this to overcome the problem of browsers not sending background images to the printer. I'll just send an Image instead. Thank you!

    ReplyDelete
  9. While waiting for javascript to update the page,
    you should stil call Application.DoEvents():

    var time = new Stopwatch();
    time.Start();
    // allow time for page scripts to update
    // the appearance of the page
    while(time.ElapsedMilliseconds < 10000)
    {
    System.Windows.Forms.Application.DoEvents();
    Thread.Sleep(1000);
    }
    time.Stop();

    And as long as WebBrowser implements IDisposable, you should dispose it at the end of call or put it inside using statement

    ReplyDelete
  10. plaese help me to take a image of particular div

    ReplyDelete
  11. what is Response.OutputStream? ... if it is web specific, then when can this not be explained without context of being from WEB app... I was looking for only to create an output image file on filesystem
    why can not this be explained without having any compile errors.

    ReplyDelete
  12. We have forms Authentication our website,The above code doesnot capture the image of the webpage that I pass in as URL.Can anyone tell how to pass override Authentication or provide some hack to pass in cookies or access sessions to get the webpage captured as image.

    ReplyDelete
  13. Good information about export webpage image in ASP.net. More helpful.

    ASP to ASP.Net Migration

    Convert ASP to ASP.Net

    ReplyDelete

Post a Comment

Popular posts from this blog