AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

WebBrowser处理html Image存取问题

2016-04-01 949
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： WebBrowser可以将Web浏览器的常用功能：如编辑、获取文本、HTML等移动PC端的应用程序。使用户能够在您的窗体中导航网页。 WebBrowser本身的属性、方法并不能完美的获取含图片的html的文本。

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

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

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

image

    一种是将图片完全转换为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.       }

  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

文章标签：
存储
JavaScript
关键词：
webbrowser HTML
HTML WebBrowser
HTML image
长空翱翔
目录
相关文章
府学路18号车神
|
Python
Python运用webbrowser打开PyEcharts生成的html文件
Python运用webbrowser打开PyEcharts生成的html文件
府学路18号车神
424 0
狼人2007
|
Web App开发
Winform 下使用WebBrowser的HTML编辑控件—WinHtmlControl 在win7 IE9下的问题
问题是这样的,有一个需要用到富文本的地方,由于是winform的程序,而且程序是上一代老员工留下的,错误百出,现在要尽量修复,至少保证能正常使用,于是就开始一点点问题修复. 在win7 64位系统下出现无法激活编辑状态,或者说无法获得光标,总之无法写入任何字符就是了.
狼人2007
1045 0
老朱教授
|
移动开发 C# Windows
WinForms C#：html编辑器工程源码，含直接写WebBrowser的文件流、IPersistStreamInit接口的声明和一些相关的小方法
老朱教授
1013 0
嗯哼9925
完全抽离WebAPi之特殊需求返回HTML、Css、JS、Image
嗯哼9925
868 0
技术小胖子
直接写入HTML字符串到WebBrowser控件中
技术小胖子
1229 0
科技小能手
|
Web App开发 C# BI
风云的银光志Silverlight4.0教程之WebBrowser控件（Silverlight内置HTML浏览器控件）
科技小能手
1150 0
技术小胖子
|
Web App开发
WebBrowser 显示Html内容不得不知的技巧
技术小胖子
1032 0
阿笨net
|
C#
C# 在 webBrowser 光标处插入 html代码 .
 private void BtnInsertMedia_Click(object sender, EventArgs e)        {            InWord frm = new InWord("请填入视频地址（后缀必须是.
阿笨net
786 0
master_haku
|
Web App开发
HTML中利用WebBrowser控件进行打印页面的控制
我们知道，web中打印并不容易。 但是利用IE浏览器自带的 Web Browser控件，我们可以轻松地做到控制打印页面设置，包括横向，纵向排列，打印预览等。 调用该控件很简单，只需要在html代码中加入如下语句即可：   下面我们给出具体代码：     Use WebBrowser For Print                .
master_haku
908 0
二二*一一
|
1月前
|
前端开发
如何利用 HTML 和 CSS 实现椭圆形布局，并在椭圆形路径上渲染可点击座位？
html 的椭圆形布局实现
二二*一一
68 1