一、WebView2庫簡介

WebView2是微軟開發的一個現代Web控件，它基于Microsoft Edge浏覽器的内部架構，提供高性能、安全穩定、易用的Web控件。與傳統的WebBrowser控件相比，WebView2具有更好的跨平台支援、更多的API接口、更好的性能和穩定性。

二、WebView2庫使用場景

WebView2庫适用于多種場景，例如：

在Win32桌面應用程式、UWP應用程式和.NET應用程式中嵌入現代Web技術，為使用者提供更加現代化、豐富的使用者體驗。
建構不同類型的浏覽器插件、擴充程式，為使用者提供更多的功能和服務。
作為遊戲引擎的一部分，提供線上遊戲運作的支援。
開發各種類型的工具、應用程式，如IDE、網站螢幕等。

三、WebView2庫的元件子產品

WebView2庫包括以下元件子產品：

WebView2 Runtime：WebView2庫需要安裝對應版本的WebView2運作時，以便在Windows上啟用它的功能
WebView2 Loader：WebView2庫的底層加載器能夠快速地将WebView2控件加載到應用程式中
WebView2 Control：WebView2控件是WebView2庫的核心，可以在Windows應用程式中嵌入現代Web技術
WebView2 SDK：WebView2庫提供了豐富的API和開發工具，幫助開發人員更好地使用WebView2控件

四、WebView2庫的優點和缺點

WebView2庫的優點：

高性能和穩定性：WebView2庫基于Microsoft Edge浏覽器内部架構，具有更高的性能和穩定性，為使用者提供更好的體驗
多種語言支援：WebView2庫可以使用多種程式設計語言進行開發，如C++、C#等
豐富的API接口：WebView2庫提供了大量的API接口，讓開發人員可以更靈活地控制WebView2控件的行為
跨平台支援：WebView2庫可以在多個作業系統上運作，包括Windows、Linux、MacOS等

WebView2庫的缺點：

安裝WebView2運作時：WebView2庫需要安裝對應版本的WebView2運作時，以便在Windows上啟用它的功能
庫檔案較大：WebView2庫的庫檔案比傳統的WebBrowser控件庫檔案要大，可能會占用一定的存儲空間

五、WebView2庫API用法

WebView2庫提供了豐富的API和開發工具，讓開發人員可以更輕松、靈活地控制WebView2控件的行為。以下是WebView2庫中常用的一些API介紹：

1. CoreWebView2

CoreWebView2是WebView2庫的核心類，它表示一個WebView2控件執行個體。CoreWebView2包含了WebView2控件的大部分功能，如導航、JavaScript互動、事件處理等。

常用屬性和方法：

AddScriptToExecuteOnDocumentCreatedAsync(string script)：将一個JavaScript腳本添加到文檔建立時執行的腳本清單中。
AddScriptToExecuteOnPageCompletedAsync(string script)：将一個JavaScript腳本添加到頁面完成時執行的腳本清單中。
ExecuteScriptAsync(string script)：執行一個JavaScript腳本并傳回結果。
Navigate(string uri)：導航到指定的URL位址。
Stop()：停止WebView2控件目前的所有導航操作。
GoBack()：将WebView2控件的導航曆史記錄向後移動一步。
GoForward()：将WebView2控件的導航曆史記錄向前移動一步。
Reload()：重新加載目前頁面。
CapturePreviewAsync(Stream imageStream, ImageFormat imageFormat)：捕獲目前頁面的預覽圖像。

事件：

CoreWebView2InitializationCompleted：當CoreWebView2對象初始化完成時觸發的事件。
NavigationStarting：當WebView2控件開始導航時觸發的事件。
ContentLoading：當WebView2控件開始加載内容時觸發的事件。
SourceChanged：當WebView2控件的源URL位址發生變化時觸發的事件。
ContentLoaded：當WebView2控件完成載入内容後觸發的事件。

2. CoreWebView2Environment

CoreWebView2Environment表示一個WebView2運作環境，它提供了WebView2控件和WebView2控件相關元件的管理和初始化功能。

常用屬性和方法：

CreateCoreWebView2Controller(IntPtr parentWindow, Action<CoreWebView2Controller> controllerCreatedCallback)：建立一個CoreWebView2Controller執行個體并放置到指定的父視窗中。
CreateCoreWebView2EnvironmentWithOptions(CoreWebView2EnvironmentOptions environmentOptions, Action<CoreWebView2Environment> environmentCreatedCallback)：根據指定的選項建立一個CoreWebView2Environment執行個體。

3. CoreWebView2Controller

CoreWebView2Controller是WebView2控件和WebView2運作環境之間的橋梁，它負責管理WebView2控件的生命周期、與浏覽器的互動等。

常用屬性和方法：

CoreWebView2：擷取目前CoreWebView2Controller對象關聯的CoreWebView2執行個體。
Close()：關閉CoreWebView2Controller對象和關聯的CoreWebView2執行個體。
AddRemoteObject(string name, object obj)：将一個.NET對象公開為JavaScript可通路的遠端對象。
RemoveRemoteObject(string name)：從CoreWebView2Controller對象中删除一個已公開的遠端對象。

4. CoreWebView2Settings

CoreWebView2Settings表示WebView2控件的一些設定，如縮放級别、核心啟用狀态等。

常用屬性：

IsScriptEnabled：擷取或設定WebView2控件是否允許JavaScript腳本執行。
IsWebMessageEnabled：擷取或設定WebView2控件是否允許使用Web消息。

5. CoreWebView2EnvironmentOptions

CoreWebView2EnvironmentOptions定義了建立CoreWebView2Environment時的一些選項和設定。

常用屬性和方法：

BrowserExecutableFolder：擷取或設定運作WebView2控件時使用的浏覽器可執行檔案路徑。
UserDataFolder：擷取或設定WebView2控件使用的使用者資料存儲檔案夾路徑。

這些API隻是WebView2庫的一部分，還有更多功能和用法可以在Microsoft官方文檔中找到。

六、winform引用WebView2庫案例說明

using Microsoft.Web.WebView2.Core;

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();

        webView21.CreationProperties = new CoreWebView2CreationProperties()
        {
            BrowserExecutableFolder = @"C:\Program Files (x86)\Microsoft\Edge\Application\91.0.864.48",
            UserDataFolder = @"C:\Temp",
        };

        webView21.CoreWebView2InitializationCompleted += WebView21_CoreWebView2InitializationCompleted;
        webView21.Source = new Uri("https://www.bing.com");
    }

    private async void WebView21_CoreWebView2InitializationCompleted(object sender, CoreWebView2InitializationCompletedEventArgs e)
    {
        await webView21.CoreWebView2.AddScriptToExecuteOnDocumentCreatedAsync("document.body.style.backgroundColor = 'lightblue';");
        await webView21.CoreWebView2.AddScriptToExecuteOnDocumentCreatedAsync("console.log('Hello from JavaScript!');");
        await webView21.CoreWebView2.Navigate("https://www.bing.com");
    }
}

在這個例子中，我們在Winform應用程式中使用了WebView2控件。我們首先初始化了WebView2控件，然後通過編寫CoreWebView2InitializationCompleted事件處理程式與WebView2進行互動。在這個例子中，我們通過AddScriptToExecuteOnDocumentCreatedAsync方法執行JavaScript腳本，并使用Navigate方法加載URL。

七、WFP引入WebView2庫案例說明

以下是一個使用WPF架構和WebView2庫的簡單案例：

首先需要在項目中安裝Microsoft.Web.WebView2 NuGet包。
在XAML中添加WebView2控件：

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <wv2:WebView2 Margin="10"/>
    </Grid>
</Window>

在C#代碼中初始化WebView2控件并加載URL：

using Microsoft.Web.WebView2.Core;

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

        webView.CreationProperties = new CoreWebView2CreationProperties()
        {
            BrowserExecutableFolder = @"C:\Program Files (x86)\Microsoft\Edge\Application\91.0.864.48",
            UserDataFolder = @"C:\Temp",
        };

        webView.CoreWebView2InitializationCompleted += WebView_CoreWebView2InitializationCompleted;
    }

    private async void WebView_CoreWebView2InitializationCompleted(object sender, CoreWebView2InitializationCompletedEventArgs e)
    {
        await webView.CoreWebView2.AddScriptToExecuteOnDocumentCreatedAsync("document.body.style.backgroundColor = 'lightblue';");
        await webView.CoreWebView2.AddScriptToExecuteOnDocumentCreatedAsync("console.log('Hello from JavaScript!');");
        await webView.CoreWebView2.Navigate("https://www.bing.com");
    }
}

在這個例子中，我們在WPF應用程式中使用了WebView2控件。我們首先初始化了WebView2控件，然後通過編寫CoreWebView2InitializationCompleted事件處理程式與WebView2進行互動。在這個例子中，我們通過AddScriptToExecuteOnDocumentCreatedAsync方法執行JavaScript腳本，并使用Navigate方法加載URL。

八、總結

WebView2庫是微軟開發的一個現代Web控件，它基于Microsoft Edge浏覽器的内部架構，提供高性能、安全穩定、易用的Web控件。WebView2庫可以适用于多種場景、跨平台支援、提供豐富的API接口等優點；但也需要安裝WebView2運作時、庫檔案較大等缺點。在Winform或者WPF應用程式中使用WebView2的方法與傳統的WebBrowser控件相比更加現代化、穩定，提供更好的使用者體驗和應用場景。

提高開發效率！深入探索微軟新釋出的WebView2庫的應用

一、WebView2庫簡介

二、WebView2庫使用場景

三、WebView2庫的元件子產品

四、WebView2庫的優點和缺點

五、WebView2庫API用法

六、winform引用WebView2庫案例說明

七、WFP引入WebView2庫案例說明

八、總結

繼續閱讀

推薦幾款可以大幅提高開發效率的vscode插件

利用 git submodule 給舊項目提升開發效率

go 開發手冊

開發者必備！提升開發效率的開發者AI工具集合

用ChatGPT搭建代碼知識庫，提升開發效率

分享一些進階 VS Code 快捷鍵，提升你的開發效率

資料結構--003--STL概述

低代碼平台與大屏設計器：化繁為簡，創新無限！💡✨💻🎨大家有沒有聽說過低代碼平台和大屏設計器？這真是讓人眼前一亮的神器啊！

全新更新的鴻蒙開發套件，你想知道的都在這裡

AI與産品有何關系？AI與産品密不可分，可以說是你中有我，我中有你。我将AI與産品的關系歸納為以下八種，分别對應不同的場

架構師學習筆記（一）技術債的危害和治理

吐血整理，全網最全資料倉庫建設知識點❗🔶為了解決多資料源導緻的口徑不一緻、資料無關聯、資料品質差、缺少曆史資料、開發效率

#前端##react##css##nextui#NextUIVersion2.0是一個基于React的UI庫，旨在提供美

【DrissionPage】DrissionPage是一個基于python的網頁自動化工具。它既能控制浏覽器，也能收發數

Windows 平台下 LiteIDE 的安裝和使用

準備好了嗎？It's time for Flutter！