如何将包含 HTML 的字符串渲染到 C# 中的图像中？答案

【问题标题】：How to render a string containing HTML into an image in C#?如何将包含 HTML 的字符串渲染到 C# 中的图像中？
【发布时间】：2011-10-08 22:36:03
【问题描述】：

我正在开发一个为用户提供交互式反馈工具的 Web 应用程序。在此应用程序中，用户可以单击发送反馈按钮。该按钮在他们当前的网页上放置一个覆盖，并允许他们拖动突出显示区域DIVs 以强调某些区域。一旦他们提交反馈，整个页面的 HTML 就会通过 AJAX 传递回服务器。

一旦在服务器上，我现在有一个包含页面 HTML 的字符串。从这里我想通过某种呈现 HTML 并构建图像的引擎运行这个字符串。如果你愿意的话，一种关于截取屏幕截图的方法。

如何才能完成这样的事情？是否有可用的引擎用 C# 编写并且可以构建 HTML 并呈现图像？

【问题讨论】：

选项 1，在此处查看 Dillie 的回答：stackoverflow.com/questions/334532/render-html-as-an-image
@DustinDavis 这不是网络表单控件吗？这是一个网络应用程序。
@Alex Ford，那个 HTML 字符串的 CSS 样式怎么样？你在考虑渲染纯 HTML 吗？
@hamlin11 我不确定这对我有什么帮助，你能解释一下吗？她说的这个魔法密码是什么？我有点困惑。
@Tocco，好问题。我不知道该怎么做。

标签： c# javascript asp.net html image

【解决方案1】：

看看这个框架 - http://awesomium.com/

这正是你所需要的。

设置基本 URL，这将需要解析任何相对 URL

WebCore.SetBaseDirectory("C:\\MyApplication\\MyBaseDirectory");

然后加载 HTML -

myWebView.LoadHTML("<p>Hello World!</p>");

然后使用 .Render() 方法，您就可以将渲染的内容保存到图像中。

【讨论】：

这绝对是我要找的。span>
D：2900 美元除外！！！ Dang... 可悲的是，我们公司的收入远远超过 10 万美元，但我知道他们不会以 2900 美元的价格出现，因为我想要它相对简单。
看起来如果我想走便宜的路线，我将不得不坚持 Google+ 的方式并使用 HTML 5 中的canvas 标记来绘制屏幕截图。然后只限制 HTML 4 浏览器中的功能。

【解决方案2】：

如果您想使用 Gecko，可以考虑使用 LLMozLib。
查看更多详情here

编辑

有一个 ActiveX 控件可以在 Windows 上嵌入 Gecko。
Sample here

编辑

我让它在 Windows 窗体应用程序上运行。
使用these resources.
它是 Gecko 的 csharp 包装器......

这是我的示例代码...

public partial class Form1 : Form
{
    public Form1()
    {
        Xpcom.Initialize(@"C:\Users\esouza\Downloads\xulrunner"); //Tell where are XUL bin
        InitializeComponent();
        //geckoWebBrowser1 is an instance of GeckoWebBrowser control that I've dragged on the Form1
        geckoWebBrowser1.DocumentCompleted += new EventHandler(geckoWebBrowser1_DocumentCompleted);
    }

    private void button1_Click(object sender, EventArgs e)
    {
        geckoWebBrowser1.Navigate("http://www.google.com");
    }

    void geckoWebBrowser1_DocumentCompleted(object sender, EventArgs e)
    {
        Bitmap b = new Bitmap(geckoWebBrowser1.Width, geckoWebBrowser1.Height);
        geckoWebBrowser1.DrawToBitmap(b, new Rectangle { X = 0, Y = 0, Width = 800, Height = 600 });
        b.Save("file.bmp");
    }
}

【讨论】：

【解决方案3】：

非常有趣的问题，我没有灵丹妙药。

您肯定需要一个具有某种描述的浏览器引擎，然后将渲染的输出捕获为位图。

我从this question 看到有一个为 WebKit 开发的 COM 包装器。也许这是一个很好的起点。

【讨论】：