WebBrowser处理html Image存取问题

WebBrowser可以将Web浏览器的常用功能：如编辑、获取文本、HTML等移动PC端的应用程序。使用户能够在您的窗体中导航网页。

WebBrowser本身的属性、方法并不能完美的获取含图片的html的文本。

图片在html中有两种表现形式：

    一种是将图片完全转换为byte[]，另一种是直接引入绝对路径。明显使用第一种方法将IMAGE以byte[]存储到DB中，在应用程序移动到别的电脑上使用时有很大优势；而使用绝对路径由于并没有把图片拷由过去则会找不到文件。

    完成方法一，需要在WebBrowser寄存的父窗体中添加几个属性及转换方法：

1.       /// Get/Set the documents body as text.
   
2.       ///
   
3.       [Browsable(false)]
   
4.       public string BodyText
   
5.       {
   
6.           get
   
7.           {
   
8.               if (webBrowser1.Document != null &&
   
9.                   webBrowser1.Document.Body != null)
   
10.               {
    
11.                   return webBrowser1.Document.Body.InnerText;
    
12.               }
    
13.               else
    
14.                   return string.Empty;
    
15.           }
    
16.           set
    
17.           {
    
18.               Document.OpenNew(false);
    
19.               if (webBrowser1.Document.Body != null)
    
20.                   webBrowser1.Document.Body.InnerText = HttpUtility.HtmlEncode(value);
    
21.           }
    
22.       }
    
23. 
    
24.       [Browsable(false)]
    
25.       public string Html
    
26.       {
    
27.           get
    
28.           {
    
29.               if (webBrowser1.Document != null &&
    
30.                   webBrowser1.Document.Body != null)
    
31.               {
    
32.                   return webBrowser1.Document.Body.InnerHtml;
    
33.               }
    
34.               else
    
35.                   return string.Empty;
    
36.           }
    
37.           set
    
38.           {
    
39.               Document.OpenNew(true);
    
40.               IHTMLDocument2 dom = Document.DomDocument as IHTMLDocument2;
    
41.               try
    
42.               {
    
43.                   if (value == null)
    
44.                       dom.clear();
    
45.                   else
    
46.                       dom.write(value);
    
47.               }
    
48.               finally
    
49.               {
    
50.                   dom.close();
    
51.               }
    
52.           }
    
53.       }
    
54. 
    
55. ///
    
56. /// Get/Set the contents of the document Body, in html.
    
57. ///
    
58. [Browsable(false)]
    
59. public string BodyHtml
    
60. {
    
61.     get
    
62.     {
    
63.         if (webBrowser1.Document != null &&
    
64.             webBrowser1.Document.Body != null)
    
65.         {
    
66.             string html = webBrowser1.Document.Body.InnerHtml;
    
67.             if (html != null)
    
68.             {
    
69.                 html = ReplaceFileSystemImages(html);
    
70.             }
    
71.             return html;
    
72.         }
    
73.         else
    
74.             return string.Empty;
    
75.     }
    
76.     set
    
77.     {
    
78.         if (webBrowser1.Document.Body != null)
    
79.             webBrowser1.Document.Body.InnerHtml = value;
    
80.     }
    
81. }

    将HTML中的图片路径转换为byte[]存储到html中的方法：

1. private string ReplaceFileSystemImages(string html)
   
2. {
   
3.     var matches = Regex.Matches(html, @"]*?src\s*=\s*([""']?[^'"">]+?['""])[^>]*?>", RegexOptions.IgnoreCase | RegexOptions.IgnorePatternWhitespace | RegexOptions.Multiline);
   
4.     foreach (Match match in matches)
   
5.     {
   
6.         string src = match.Groups[1].Value;
   
7.         src = src.Trim('\"');
   
8.         if (File.Exists(src))
   
9.         {
   
10.             var ext = Path.GetExtension(src);
    
11.             if (ext.Length > 0)
    
12.             {
    
13.                 ext = ext.Substring(1);
    
14.                 src = string.Format("'data:image/{0};base64,{1}'", ext, Convert.ToBase64String(File.ReadAllBytes(src)));
    
15.                 html = html.Replace(match.Groups[1].Value, src);
    
16.             }
    
17.         }
    
18.     }
    
19.     return html;
    
20. }

参考文献：

https://msdn.microsoft.com/zh-cn/library/system.windows.forms.webbrowser(v=vs.110).aspx