.NET混合应用中，WebView2的导航事件处理方案有哪些？
- 内容介绍
- 相关推荐
本文共计1400个文字，预计阅读时间需要6分钟。
系列目录【已更新最新开发文章，点击查看详情】+ WebView2控件应用详解系列博客+.NET桌面程序集成Web网页开发的十种解决方案+.NET混合开发解决方案1+WebView2简介+.NET混合开发解决方案2
系列目录WebView2控件应用详解系列博客
.NET桌面程序集成Web网页开发的十种解决方案
.NET混合开发解决方案1 WebView2简介
.NET混合开发解决方案2 WebView2与Edge浏览器的区别
.NET混合开发解决方案3 WebView2的进程模型
.NET混合开发解决方案4 WebView2的线程模型
.NET混合开发解决方案5 WebView2运行时与分发应用
.NET混合开发解决方案6检测是否已安装合适的WebView2运行时.NET混合开发解决方案7 WinForm程序中通过NuGet管理器引用集成WebView2控件
.NET混合开发解决方案8 WinForm程序中通过设置固定版本运行时的BrowserExecutableFolder属性集成WebView2控件
在我的博客《.NET混合开发解决方案7 WinForm程序中集成WebView2》中介绍了WinForm程序中集成WebView2组件的详细步骤以及注意事项。这只是最基本的应用，WebView2功能之所以强大，是因为它提供了很多开放的属性与事件供开发者调用以完成复杂的功能。具体可以参考我的博客《.NET混合开发解决方案2 WebView2与Edge浏览器的区别》。
本文介绍WebView2应用程序的导航事件。当WebView2实例中显示的内容发生特定的异步操作时，导航事件会运行。例如，当WebView2用户导航到新网站时，本机内容（WinForm、WPF、Win32、WinUI）通过侦听 NavigationStarting 事件来侦听更改。导航操作完成后，NavigationCompleted 事件将运行。
导航事件的正常顺序为：
- NavigationStarting
- SourceChanged
- ContentLoading
- HistoryChanged
- BasicAuthenticationRequested
- DOMContentLoaded
- NavigationCompleted
以下事件描述每次导航操作期间 WebView2 的状态：
上图显示了在各自的事件参数上具有相同NavigationId属性的导航事件。
- 使用导航ID（在NavigationId事件中提供）跟踪每个新文档的导航事件。每次成功导航到新文档时，WebView2的NavigationId事件都会发生更改。
- 具有不同NavigationId事件实例的导航事件可能会重叠。例如，启动导航事件时，必须等待相关的NavigationStarting事件。如果随后启动另一个导航，您将看到以下序列：
- 第一次导航的 NavigationStarting 事件。
- 第二次导航的 NavigationStarting 事件。
- 第一次导航的 NavigationCompleted 事件。
- 第二次导航的所有其他相应导航事件。
- 在错误情况下，可能有或可能没有内容加载事件，这取决于导航是否继续导航到错误页面。
- 如果发生HTTP重定向，则一行中有多个NavigationStarting事件，其中后面的事件参数设置了IsRedirect属性；但是，NavigationId事件保持不变。
- 相同的文档导航事件（例如导航到同一文档中的片段）不会导致NavigationStarting事件，也不会增加NavigationId事件。
- 要监视或取消WebView2实例中子框架内的导航事件，请使用FrameNavigationStarting和FrameNavigationCompleted事件。这些事件的行为类似于等效的非框架对应事件。
当在文本框中输入目标网址后，点击按钮，具体执行逻辑如下
发生错误时，会引发以下事件，这可能取决于对错误网页的导航：
SourceChangedContentLoadingHistoryChanged
示例演示如果发生HTTP重定向，则一行中有多个NavigationStarting事件。
先看一个效果动画
逻辑代码
1 public partial class Frm2Navigation : Form 2 { 3 public Frm2Navigation() 4 { 5 InitializeComponent(); 6 7 InitializeAsync(); 8 9 webView2.CoreWebView2InitializationCompleted += WebView2_CoreWebView2InitializationCompleted; 10 11 webView2.NavigationStarting += WebView2_NavigationStarting; 12 webView2.NavigationCompleted += WebView2_NavigationCompleted; 13 } 14 15 async void InitializeAsync() 16 { 17 await webView2.EnsureCoreWebView2Async(null); 18 } 19 20 private void WebView2_CoreWebView2InitializationCompleted(object? sender, CoreWebView2InitializationCompletedEventArgs e) 21 { 22 if (e.IsSuccess == false) 23 { 24 MessageBox.Show("WebView2_CoreWebView2InitializationCompleted 事件，发生异常。" 25 + Environment.NewLine + e.InitializationException.Message, 26 "提示", MessageBoxButtons.OK, MessageBoxIcon.Error); 27 } 28 29 webView2.SourceChanged += WebView2_SourceChanged; 30 webView2.ContentLoading += WebView2_ContentLoading; 31 webView2.CoreWebView2.HistoryChanged += CoreWebView2_HistoryChanged; 32 webView2.CoreWebView2.DOMContentLoaded += CoreWebView2_DOMContentLoaded; 33 34 webView2.CoreWebView2.BasicAuthenticationRequested += CoreWebView2_BasicAuthenticationRequested; 35 webView2.CoreWebView2.ProcessFailed += CoreWebView2_ProcessFailed; 36 } 37 38 private void WebView2_NavigationStarting(object? sender, CoreWebView2NavigationStartingEventArgs e) 39 { 40 string uri = e.Uri; 41 if (!uri.StartsWith("")) 42 { 43 //webView2.CoreWebView2.ExecuteScriptAsync($"alert('{uri} 不安全, 请尝试标记 143 uri = new Uri("" + rawUrl); 144 } 145 else if (rawUrl.StartsWith("") == false) 146 { 147 uri = new Uri("" + rawUrl); 148 } 149 else 150 { 151 // 其他情况将其视为网络搜索 152 uri = new Uri("bing.com/search?q=" + string.Join("+", Uri.EscapeDataString(rawUrl).Split(new string[] { "%20" }, StringSplitOptions.RemoveEmptyEntries))); 153 } 154 155 //webView2.CoreWebView2.Navigate(url.Trim()); 156 webView2.Source = uri; 157 } 158 }
注意事项
CoreWebview2的相关事件必须在它的CoreWebView2InitializationCompleted 事件（CoreWebView2对象初始化完成后事件）里面注册
- webView2.CoreWebView2.HistoryChanged
- webView2.CoreWebView2.DOMContentLoaded
- webView2.CoreWebView2.BasicAuthenticationRequested
- webView2.CoreWebView2.ProcessFailed
如上第31、32、34、35行。
系列目录成在管理，败在经验；嬴在选择，输在不学！ 贵在坚持！
欢迎关注作者头条号 张传宁IT讲堂，获取更多IT文章、视频等优质内容。
个人作品
BIMFace.SDK.NET
开源地址：gitee.com/NAlps/BIMFace.SDK
系列博客：www.cnblogs.com/SavionZhang/p/11424431.html
系列视频：www.cnblogs.com/SavionZhang/p/14258393.html
技术栈
1、Visual Studio、.C#/.NET、.NET Core、MVC、Web API、RESTful API、gRPC、SignalR、Python
2、jQuery、Vue.js、Bootstrap
3、数据库：SQLServer、MySQL、PostgreSQL、Oracle、SQLite、Redis、MongoDB、ElasticSearch、TiDB、达梦DM、人大金仓、 神通、南大通用 GBase
4、ORM：Dapper、Entity Framework、FreeSql、SqlSugar、分库分表、读写分离
5、架构：领域驱动设计 DDD、ABP
6、环境：跨平台、Windows、Linux（CentOS、麒麟、统信UOS、深度Linux）、maxOS、IIS、Nginx
7、移动App：Android、IOS、HarmonyOS、微信、小程序、uni-app、MUI、Xamarin、Smobiler
云原生、微服务、Docker、CI/CD、DevOps、K8S；
Dapr、RabbitMQ、Kafka、分布式、大数据、高并发、负载均衡、中间件、RPC、ELK；
.NET + Docker + jenkins + Github + Harbor + K8S；
出处：www.cnblogs.com/SavionZhang
本文共计1400个文字，预计阅读时间需要6分钟。
系列目录【已更新最新开发文章，点击查看详情】+ WebView2控件应用详解系列博客+.NET桌面程序集成Web网页开发的十种解决方案+.NET混合开发解决方案1+WebView2简介+.NET混合开发解决方案2
系列目录WebView2控件应用详解系列博客
.NET桌面程序集成Web网页开发的十种解决方案
.NET混合开发解决方案1 WebView2简介
.NET混合开发解决方案2 WebView2与Edge浏览器的区别
.NET混合开发解决方案3 WebView2的进程模型
.NET混合开发解决方案4 WebView2的线程模型
.NET混合开发解决方案5 WebView2运行时与分发应用
.NET混合开发解决方案6检测是否已安装合适的WebView2运行时.NET混合开发解决方案7 WinForm程序中通过NuGet管理器引用集成WebView2控件
.NET混合开发解决方案8 WinForm程序中通过设置固定版本运行时的BrowserExecutableFolder属性集成WebView2控件
在我的博客《.NET混合开发解决方案7 WinForm程序中集成WebView2》中介绍了WinForm程序中集成WebView2组件的详细步骤以及注意事项。这只是最基本的应用，WebView2功能之所以强大，是因为它提供了很多开放的属性与事件供开发者调用以完成复杂的功能。具体可以参考我的博客《.NET混合开发解决方案2 WebView2与Edge浏览器的区别》。
本文介绍WebView2应用程序的导航事件。当WebView2实例中显示的内容发生特定的异步操作时，导航事件会运行。例如，当WebView2用户导航到新网站时，本机内容（WinForm、WPF、Win32、WinUI）通过侦听 NavigationStarting 事件来侦听更改。导航操作完成后，NavigationCompleted 事件将运行。
导航事件的正常顺序为：
- NavigationStarting
- SourceChanged
- ContentLoading
- HistoryChanged
- BasicAuthenticationRequested
- DOMContentLoaded
- NavigationCompleted
以下事件描述每次导航操作期间 WebView2 的状态：
上图显示了在各自的事件参数上具有相同NavigationId属性的导航事件。
- 使用导航ID（在NavigationId事件中提供）跟踪每个新文档的导航事件。每次成功导航到新文档时，WebView2的NavigationId事件都会发生更改。
- 具有不同NavigationId事件实例的导航事件可能会重叠。例如，启动导航事件时，必须等待相关的NavigationStarting事件。如果随后启动另一个导航，您将看到以下序列：
- 第一次导航的 NavigationStarting 事件。
- 第二次导航的 NavigationStarting 事件。
- 第一次导航的 NavigationCompleted 事件。
- 第二次导航的所有其他相应导航事件。
- 在错误情况下，可能有或可能没有内容加载事件，这取决于导航是否继续导航到错误页面。
- 如果发生HTTP重定向，则一行中有多个NavigationStarting事件，其中后面的事件参数设置了IsRedirect属性；但是，NavigationId事件保持不变。
- 相同的文档导航事件（例如导航到同一文档中的片段）不会导致NavigationStarting事件，也不会增加NavigationId事件。
- 要监视或取消WebView2实例中子框架内的导航事件，请使用FrameNavigationStarting和FrameNavigationCompleted事件。这些事件的行为类似于等效的非框架对应事件。
当在文本框中输入目标网址后，点击按钮，具体执行逻辑如下
发生错误时，会引发以下事件，这可能取决于对错误网页的导航：
SourceChangedContentLoadingHistoryChanged
示例演示如果发生HTTP重定向，则一行中有多个NavigationStarting事件。
先看一个效果动画
逻辑代码
1 public partial class Frm2Navigation : Form 2 { 3 public Frm2Navigation() 4 { 5 InitializeComponent(); 6 7 InitializeAsync(); 8 9 webView2.CoreWebView2InitializationCompleted += WebView2_CoreWebView2InitializationCompleted; 10 11 webView2.NavigationStarting += WebView2_NavigationStarting; 12 webView2.NavigationCompleted += WebView2_NavigationCompleted; 13 } 14 15 async void InitializeAsync() 16 { 17 await webView2.EnsureCoreWebView2Async(null); 18 } 19 20 private void WebView2_CoreWebView2InitializationCompleted(object? sender, CoreWebView2InitializationCompletedEventArgs e) 21 { 22 if (e.IsSuccess == false) 23 { 24 MessageBox.Show("WebView2_CoreWebView2InitializationCompleted 事件，发生异常。" 25 + Environment.NewLine + e.InitializationException.Message, 26 "提示", MessageBoxButtons.OK, MessageBoxIcon.Error); 27 } 28 29 webView2.SourceChanged += WebView2_SourceChanged; 30 webView2.ContentLoading += WebView2_ContentLoading; 31 webView2.CoreWebView2.HistoryChanged += CoreWebView2_HistoryChanged; 32 webView2.CoreWebView2.DOMContentLoaded += CoreWebView2_DOMContentLoaded; 33 34 webView2.CoreWebView2.BasicAuthenticationRequested += CoreWebView2_BasicAuthenticationRequested; 35 webView2.CoreWebView2.ProcessFailed += CoreWebView2_ProcessFailed; 36 } 37 38 private void WebView2_NavigationStarting(object? sender, CoreWebView2NavigationStartingEventArgs e) 39 { 40 string uri = e.Uri; 41 if (!uri.StartsWith("")) 42 { 43 //webView2.CoreWebView2.ExecuteScriptAsync($"alert('{uri} 不安全, 请尝试标记 143 uri = new Uri("" + rawUrl); 144 } 145 else if (rawUrl.StartsWith("") == false) 146 { 147 uri = new Uri("" + rawUrl); 148 } 149 else 150 { 151 // 其他情况将其视为网络搜索 152 uri = new Uri("bing.com/search?q=" + string.Join("+", Uri.EscapeDataString(rawUrl).Split(new string[] { "%20" }, StringSplitOptions.RemoveEmptyEntries))); 153 } 154 155 //webView2.CoreWebView2.Navigate(url.Trim()); 156 webView2.Source = uri; 157 } 158 }
注意事项
CoreWebview2的相关事件必须在它的CoreWebView2InitializationCompleted 事件（CoreWebView2对象初始化完成后事件）里面注册
- webView2.CoreWebView2.HistoryChanged
- webView2.CoreWebView2.DOMContentLoaded
- webView2.CoreWebView2.BasicAuthenticationRequested
- webView2.CoreWebView2.ProcessFailed
如上第31、32、34、35行。
系列目录成在管理，败在经验；嬴在选择，输在不学！ 贵在坚持！
欢迎关注作者头条号 张传宁IT讲堂，获取更多IT文章、视频等优质内容。
个人作品
BIMFace.SDK.NET
开源地址：gitee.com/NAlps/BIMFace.SDK
系列博客：www.cnblogs.com/SavionZhang/p/11424431.html
系列视频：www.cnblogs.com/SavionZhang/p/14258393.html
技术栈
1、Visual Studio、.C#/.NET、.NET Core、MVC、Web API、RESTful API、gRPC、SignalR、Python
2、jQuery、Vue.js、Bootstrap
3、数据库：SQLServer、MySQL、PostgreSQL、Oracle、SQLite、Redis、MongoDB、ElasticSearch、TiDB、达梦DM、人大金仓、 神通、南大通用 GBase
4、ORM：Dapper、Entity Framework、FreeSql、SqlSugar、分库分表、读写分离
5、架构：领域驱动设计 DDD、ABP
6、环境：跨平台、Windows、Linux（CentOS、麒麟、统信UOS、深度Linux）、maxOS、IIS、Nginx
7、移动App：Android、IOS、HarmonyOS、微信、小程序、uni-app、MUI、Xamarin、Smobiler
云原生、微服务、Docker、CI/CD、DevOps、K8S；
Dapr、RabbitMQ、Kafka、分布式、大数据、高并发、负载均衡、中间件、RPC、ELK；
.NET + Docker + jenkins + Github + Harbor + K8S；
出处：www.cnblogs.com/SavionZhang