从 ASP.NET 将网页转换为图像

Posted

技术标签:

【中文标题】从 ASP.NET 将网页转换为图像【英文标题】:Convert webpage to image from ASP.NET 【发布时间】:2011-02-12 12:14:31 【问题描述】:

我想在 C# 中创建一个函数,该函数获取特定网页并将其从 ASP.NET 中转换为 JPG 图像。 我不想通过第三方或缩略图服务执行此操作,因为我需要完整的图像。我认为我需要以某种方式利用 ASP.NET 中的 webbrowser 控件,但我只是可以'不知道从哪里开始。有人有例子吗?

【问题讨论】:

这将非常困难。 哇!多么棒的问题。我的第一反应是使用 WebBrowser 控件并使用 DrawToBitmap 方法,但文档中说“此控件不支持此方法”。哦,好吧。 所以我猜 DrawToBitmap 有效。我应该为此获得积分! :O) 具体是什么阻止了它的工作? @SLaks - 困难是一种心态。不努力怎么能说难呢? 【参考方案1】:

好的,当我结合几种不同的解决方案时,这相当容易:

这些解决方案为我提供了一种使用 ASP.NET 中的 WebBrowser 的线程安全方式:

http://www.beansoftware.com/ASP.NET-Tutorials/Get-Web-Site-Thumbnail-Image.aspx

http://www.eggheadcafe.com/tutorials/aspnet/b7cce396-e2b3-42d7-9571-cdc4eb38f3c1/build-a-selfcaching-asp.aspx

这个解决方案给了我一种将 BMP 转换为 JPG 的方法:

Bmp to jpg/png in C#

我只是修改了代码并将以下内容放入 .cs:

using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using System.Threading;
using System.Windows.Forms;

public class WebsiteToImage

    private Bitmap m_Bitmap;
    private string m_Url;
    private string m_FileName = string.Empty;

    public WebsiteToImage(string url)
    
        // Without file 
        m_Url = url;
    

    public WebsiteToImage(string url, string fileName)
    
        // With file 
        m_Url = url;
        m_FileName = fileName;
    

    public Bitmap Generate()
    
        // Thread 
        var m_thread = new Thread(_Generate);
        m_thread.SetApartmentState(ApartmentState.STA);
        m_thread.Start();
        m_thread.Join();
        return m_Bitmap;
    

    private void _Generate()
    
        var browser = new WebBrowser  ScrollBarsEnabled = false ;
        browser.Navigate(m_Url);
        browser.DocumentCompleted += WebBrowser_DocumentCompleted;

        while (browser.ReadyState != WebBrowserReadyState.Complete)
        
            Application.DoEvents();
        

        browser.Dispose();
    

    private void WebBrowser_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
    
        // Capture 
        var browser = (WebBrowser)sender;
        browser.ClientSize = new Size(browser.Document.Body.ScrollRectangle.Width, browser.Document.Body.ScrollRectangle.Bottom);
        browser.ScrollBarsEnabled = false;
        m_Bitmap = new Bitmap(browser.Document.Body.ScrollRectangle.Width, browser.Document.Body.ScrollRectangle.Bottom);
        browser.BringToFront();
        browser.DrawToBitmap(m_Bitmap, browser.Bounds);

        // Save as file? 
        if (m_FileName.Length > 0)
        
            // Save 
            m_Bitmap.SaveJPG100(m_FileName);
        
    


public static class BitmapExtensions

    public static void SaveJPG100(this Bitmap bmp, string filename)
    
        var encoderParameters = new EncoderParameters(1);
        encoderParameters.Param[0] = new EncoderParameter(System.Drawing.Imaging.Encoder.Quality, 100L);
        bmp.Save(filename, GetEncoder(ImageFormat.Jpeg), encoderParameters);
    

    public static void SaveJPG100(this Bitmap bmp, Stream stream)
    
        var encoderParameters = new EncoderParameters(1);
        encoderParameters.Param[0] = new EncoderParameter(System.Drawing.Imaging.Encoder.Quality, 100L);
        bmp.Save(stream, GetEncoder(ImageFormat.Jpeg), encoderParameters);
    

    public static ImageCodecInfo GetEncoder(ImageFormat format)
    
        var codecs = ImageCodecInfo.GetImageDecoders();

        foreach (var codec in codecs)
        
            if (codec.FormatID == format.Guid)
            
                return codec;
            
        

        // Return 
        return null;
    

并且可以这样称呼它:

WebsiteToImage websiteToImage = new WebsiteToImage( "http://www.cnn.com", @"C:\Some Folder\Test.jpg");
websiteToImage.Generate();

它适用于文件和流。 确保在 ASP.NET 项目中添加对 System.Windows.Forms 的引用。希望这会有所帮助。

更新:我更新了代码以包含捕获整个页面的功能,并且不需要任何特殊设置即可仅捕获其中的一部分。

【讨论】:

@SLaks - 为什么?你特别关心什么?使用 WebBrowser 控件与生成用于显示的图像的图表控件没有太大区别。我不一定同意应该使用线程。我可能会使用 Control.Invoke 并让控件处理它。 @AMissico:我不认为 WinForms 控件在非交互式会话中可靠地工作。不过,我可能错了。 @Amissico 来自第一篇文章:首先,作为一个 Windows 窗体控件,它必须在 STA(单线程单元)线程上运行。这意味着您需要在使用它的页面上设置 AspCompat = "true" 属性,或者您需要在状态已设置为 STA 的辅助线程上对目标页面进行实际的 Webbrowser Navigate 调用。我选择后者。 @Nissan Fan - 好的,我现在明白了。然而,为什么代码未经修改就可以为我工作?即使使用 AspCompat="true|false" 它仍然有效。 (我在本地 ASP.NET 开发服务器上使用 VS2k8。) @BornToCode 在技术上不需要,但让您的应用为其他事情腾出事件周期。【参考方案2】:

Mr Cat Man Do 的好解决方案。

我需要添加一行来抑制某些网页中出现的一些错误 (在我一位很棒的同事的帮助下)

private void _Generate()

    var browser = new WebBrowser  ScrollBarsEnabled = false ;

    browser.ScriptErrorsSuppressed = true;        //           <--

    browser.Navigate(m_Url);
    browser.DocumentCompleted += WebBrowser_DocumentCompleted;

...

谢谢先生

【讨论】:

【参考方案3】:

这是我使用扩展方法和任务工厂而不是线程的实现:

/// <summary>
    /// Convert url to bitmap byte array
    /// </summary>
    /// <param name="url">Url to browse</param>
    /// <param name="width">width of page (if page contains frame, you need to pass this params)</param>
    /// <param name="height">heigth of page (if page contains frame, you need to pass this params)</param>
    /// <param name="htmlToManipulate">function to manipulate dom</param>
    /// <param name="timeout">in milliseconds, how long can you wait for page response?</param>
    /// <returns>bitmap byte[]</returns>
    /// <example>
    /// byte[] img = new Uri("http://www.uol.com.br").ToImage();
    /// </example>
    public static byte[] ToImage(this Uri url, int? width = null, int? height = null, Action<HtmlDocument> htmlToManipulate = null, int timeout = -1)
    
        byte[] toReturn = null;

        Task tsk = Task.Factory.StartNew(() =>
        
            WebBrowser browser = new WebBrowser()  ScrollBarsEnabled = false ;
            browser.Navigate(url);

            browser.DocumentCompleted += (s, e) =>
            
                var browserSender = (WebBrowser)s;

                if (browserSender.ReadyState == WebBrowserReadyState.Complete)
                
                    if (htmlToManipulate != null) htmlToManipulate(browserSender.Document);

                    browserSender.ClientSize = new Size(width ?? browser.Document.Body.ScrollRectangle.Width, height ?? browser.Document.Body.ScrollRectangle.Bottom);
                    browserSender.ScrollBarsEnabled = false;
                    browserSender.BringToFront();

                    using (Bitmap bmp = new Bitmap(browserSender.Document.Body.ScrollRectangle.Width, browserSender.Document.Body.ScrollRectangle.Bottom))
                    
                        browserSender.DrawToBitmap(bmp, browserSender.Bounds);
                        toReturn = (byte[])new ImageConverter().ConvertTo(bmp, typeof(byte[]));
                    
                

            ;

            while (browser.ReadyState != WebBrowserReadyState.Complete)
            
                Application.DoEvents();
            

            browser.Dispose();

        , CancellationToken.None, TaskCreationOptions.None, TaskScheduler.FromCurrentSynchronizationContext());

        tsk.Wait(timeout);

        return toReturn;
    

【讨论】:

+1 用于使用任务...虽然不喜欢使用 ext 方法。另外,为什么不通过 Size、TimeSpan 等呢?这些结构的存在是有原因的......【参考方案4】:

Peter Bromberg 有一篇关于这个主题的好文章 here。他的解决方案似乎可以满足您的需求...

【讨论】:

【参考方案5】:

解决方案很完美,只需要固定在设置图像宽度的行中。对于具有 LARGE HEIGHT 的页面,它没有适当地设置 WIDTH:

    //browser.ClientSize = new Size(browser.Document.Body.ScrollRectangle.Width, browser.Document.Body.ScrollRectangle.Bottom);
    browser.ClientSize = new Size(1000, browser.Document.Body.ScrollRectangle.Bottom);

要添加对 System.Windows.Forms 的引用,您应该在 ADD REFERENCE 的 .NET 选项卡中进行,而不是在 COM 选项卡中进行。

【讨论】:

【参考方案6】:

您可以使用WatiN 打开一个新的浏览器,然后捕获屏幕并适当地裁剪它。

【讨论】:

这将需要在它自己的进程中盯着一个真正的浏览器。并不是一个可以很好扩展的解决方案。

以上是关于从 ASP.NET 将网页转换为图像的主要内容,如果未能解决你的问题,请参考以下文章

将图像数据从 iPhone 传输到 ASP .NET 服务器的所有方法都有哪些

从 asp.net 扫描图像

在 ASP.NET 中将 HTML 转换为 PDF [重复]

使用 c# 在 ASP.net 中更改背景图像

如何在 ASP.NET 中将 base64 图像 URL 转换为用户友好 URL

asp.net 从 mp3 创建波形图像