网站首页 > 技术文章 正文
上次说为了不想在web端登录博客园,我想着还是继续使用MarkWord编写博客,不过在使用的过程中,如果markdown文件的目录中有中文的话,Markdown预览就不能够显示粘贴的图片了,原因是之前.NET Framework的WeBrowser库太老了,应该升级一下。
替换WebBrowser的方案很多,在Stackoverflow上有人推荐使用WebView2,我就直接用了,也没有多想,实际上使用的问题还是不少的,简单记录一下。
WebView2#
这个东西是微软推出基于Edge或者说是基于chromium内核的浏览器组件,可以提供现代的浏览器体验,用于集成到.NET程序中,实现.NET对web的访问与调用,或者反过来也行。这个东西感觉是CefSharp的有利竞争者呀,虽然我也没咋用过CefSharp。
WebBrowser->WebView2#
迁移的第一步是引用的替换,WebBrowser在
System.Windows.Forms.WebBrowser命名空间,如果使用WPF的话,需要使用WindowsFormsHost,这个就体验不是那么好了,WPF下,有
Microsoft.Web.WebView2.Wpf,可以提供给WPF原生的访问,赞一个。
访问DOM#
然后就是出现的错误了,最难受的是,WebView2不提供对DOM的访问权限!,WebBrowser可以直接通过Document来访问DOM节点,而WebView2只能设置访问的Uri信息,然后控制导航与调用js。
为了实现动态的控制预览框的内容,访问DOM是必须的,如果我动态的渲染一个文件,然后随时再构造Uri,再传递到WebView2中,那太啰嗦了。由于这个东西可以直接调用JS,那么我们换一个思路:通过WebView2调用JS,然后使用Js操作DOM,曲线实现控制DOM的目标。废话不多说,直接上代码。
if (winWebDoc.CoreWebView2 == null)
return;
var script = "document.body.innerHTML = '" + Markdown.ToHtml(MarkValue, pipeline).Trim() + "'";
winWebDoc.ExecuteScriptAsync(script);
之前我也尝试过document.write的方法,发现有点问题,还是不能正常识别。
WebView2除了直接在传递js的函数体以外,还可以调用页面中的顶级JS函数,具体使用方法参见后面的参考文献或者园子里面的这篇文章,反正我这么使用之后中文目录的问题就解决了,不过右侧渲染如果有回车换行的话,就经常会卡死,好像是引擎就崩溃了。
替换默认换行#
经过debug,发现WebView2在运行的过程中,需要渲染的html内,标签之间不能有\r\n之类的东西,如果有就寄了。而使用
CommonMark.CommonMarkConverter.Convert方法转换的markdown文件都会有这个东西...
这个库时间也比较久远了,经过简单研究,我换成了Markdig这个库,二者兼容,而且Markdig还提供了更多定制的地方,我这里将所有的换行,替换为空字符。
private MarkdownPipeline pipeline = new MarkdownPipelineBuilder()
.ConfigureNewLine("")
.Build();
这样,换行就没啥问题了,但是在初次使用时,会出现WebView2无法正常渲染的问题。
WebView2初始化#
WebView2的初始化和其他的库有点不同,它提供了一个EnsureCoreWebView2Async的方法,对它的操作,请一定等这个方法返回。可以使用await,也可以和我一样,使用TPL。
winWebDoc.EnsureCoreWebView2Async()
.ContinueWith(t =>
{
Dispatcher.Invoke(() =>
{
winWebDoc.Source = new Uri(System.IO.Path.Combine(Environment.CurrentDirectory, "index.html"));
});
});
注意我这里使用加载了一个本地的模板HTML文件,访问本地文件的时候,需要使用Uri的方式访问。
结语#
经过了一番折腾,终于是能够继续使用MarkWord写博客了,虽然我更换了主题之后,滚动不是很利索了,另外渲染代码换行好像还有点问题,不过好歹能用了,以后再折腾吧。
作者:波多尔斯基
出处:
https://www.cnblogs.com/podolski/p/16199151.html
猜你喜欢
- 2025-04-26 3款 .NET 开源的编辑器,包含代码、文本和Markdown编辑功能!
- 2025-04-26 Markdown 格式如何转换成 Word?
- 2025-04-26 jupyter lab修改默认文件目录
- 2025-04-26 一款优秀的微信Markdown编辑神器及私有化部署流程
- 2025-04-26 PDF文件转markdown格式软件Marker1.6.1版整合包下载
- 2025-04-26 Microsoft MarkItDown:使用Llama库将 Office 文件转换为 Markdown
- 2025-04-26 Web Essentials之Markdown和自定义编辑器
- 2025-04-26 只要多加这样一句提示词,就能让DeepSeek帮你生成下载各种文档!
- 2025-04-26 java使用pandoc将markdown转换为word文档
- 2025-04-26 android上的markdown软件比较
- 06-13C++之类和对象(c++中类和对象的区别)
- 06-13C语言进阶教程:数据结构 - 哈希表的基本原理与实现
- 06-13C语言实现见缝插圆游戏!零基础代码思路+源码分享
- 06-13Windows 10下使用编译并使用openCV
- 06-13C语言进阶教程:栈和队列的实现与应用
- 06-13C语言这些常见标准文件该如何使用?很基础也很重要
- 06-13C语言 vs C++:谁才是编程界的“全能王者”?
- 06-13C语言无锁编程指南(c语言锁机代码)
- 最近发表
- 标签列表
-
- cmd/c (64)
- c++中::是什么意思 (83)
- 标签用于 (65)
- 主键只能有一个吗 (66)
- c#console.writeline不显示 (75)
- pythoncase语句 (81)
- es6includes (73)
- sqlset (64)
- windowsscripthost (67)
- apt-getinstall-y (86)
- node_modules怎么生成 (76)
- chromepost (65)
- c++int转char (75)
- static函数和普通函数 (76)
- el-date-picker开始日期早于结束日期 (70)
- localstorage.removeitem (74)
- vector线程安全吗 (70)
- & (66)
- java (73)
- js数组插入 (83)
- linux删除一个文件夹 (65)
- mac安装java (72)
- eacces (67)
- 查看mysql是否启动 (70)
- 无效的列索引 (74)