.NET 桌面程序集成Web網(wǎng)頁多種解決方案

B/S架構(gòu)的Web程序幾乎占據(jù)了應(yīng)用軟件的絕大多數(shù)市場(chǎng)，但是C/S架構(gòu)的WinForm、WPF客戶端程序依然具有很實(shí)用的價(jià)值，如設(shè)計(jì)類軟件 AutoCAD與Autodesk Revit、WPS、IT類的集成開發(fā)環(huán)境（數(shù)據(jù)庫、圖形處理軟件）、PC端的小工具等等，充分利用了客戶端電腦的資源綜合計(jì)算能力，處理性能更加優(yōu)秀。

如果想在C/S架構(gòu)的客戶端程序中集成Web應(yīng)用，也只能借助Web網(wǎng)頁，然后將網(wǎng)頁集成到客戶端程序中，這樣就間接的達(dá)到了目的。

下面是客戶端審圖系統(tǒng)中集成Web網(wǎng)頁的實(shí)際應(yīng)用案例

WinForm程序中集成網(wǎng)頁的基本原理就是通過一個(gè)包含類似瀏覽器功能的控件，將Web網(wǎng)頁載入并解析渲染出來。

介紹 WinForm、WPF 集成 Web 網(wǎng)頁的多種技術(shù)方案之前，先了解一下瀏覽器的內(nèi)核。

瀏覽器最重要或者說核心的部分是“Rendering Engine”，可大概譯為“渲染引擎”，不過我們一般習(xí)慣將之稱為“瀏覽器內(nèi)核”。負(fù)責(zé)對(duì)網(wǎng)頁語法的解釋（如標(biāo)準(zhǔn)通用標(biāo)記語言下的一個(gè)應(yīng)用HTML、JavaScript）并渲染（顯示）網(wǎng)頁。所以，通常所謂的瀏覽器內(nèi)核也就是瀏覽器所采用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網(wǎng)頁的內(nèi)容以及頁面的格式信息。不同的瀏覽器內(nèi)核對(duì)網(wǎng)頁編寫語法的解釋也有不同，因此同一網(wǎng)頁在不同的內(nèi)核的瀏覽器里的渲染（顯示）效果也可能不同，這也是網(wǎng)頁編寫者需要在不同內(nèi)核的瀏覽器中測(cè)試網(wǎng)頁顯示效果的原因。

內(nèi)核分類

• Trident（MSHTML、IE內(nèi)核）

內(nèi)核被包含在全世界最高的使用率的操作系統(tǒng)中，即為Windows操作系統(tǒng)，所以我們又經(jīng)常把它稱之為IE內(nèi)核。

Trident內(nèi)核的常見瀏覽器有：

• IE6、IE7、IE8（Trident 4.0）、IE9（Trident 5.0）、IE10（Trident 6.0）、IE11
• 360安全瀏覽器（1.0-5.0為Trident，6.0為Trident+Webkit，7.0為Trident+Blink）
• 360極速瀏覽器（7.5之前為Trident+Webkit，7.5為Trident+Blink）
• 百度瀏覽器（早期版本）
• 世界之窗瀏覽器（最初為IE內(nèi)核，2013年采用Chrome+IE內(nèi)核）
• UC瀏覽器（Webkit內(nèi)核+Trident內(nèi)核）
• 其他等

其中部分瀏覽器的新版本是“雙核”甚至是“多核”，其中一個(gè)內(nèi)核是Trident，然后再增加一個(gè)其他內(nèi)核。國(guó)內(nèi)的廠商一般把其他內(nèi)核叫做“高速瀏覽模式”，而Trident則是“兼容瀏覽模式”，用戶可以來回切換。

• Gecko（Firefox內(nèi)核）

Gecko內(nèi)核常見的瀏覽器：[Mozilla Firefox](https://baike.baidu.com/item/Mozilla Firefox)、Mozilla SeaMonkey、waterfox（Firefox的64位開源版）、Iceweasel、Epiphany（早期版本）、Flock（早期版本）、K-Meleon。

• Webkit（Safari內(nèi)核，Chrome內(nèi)核原型，開源）

WebKit內(nèi)核常見的瀏覽器：Chrome、傲游瀏覽器3、Apple Safari （Win/Mac/iPhone/iPad）、Symbian手機(jī)瀏覽器、Android 默認(rèn)瀏覽器。

參考網(wǎng)站：https://liulanmi.com/labs/core.html

• Blink

Blink是一個(gè)由Google和Opera Software開發(fā)的瀏覽器排版引擎，Google計(jì)劃將這個(gè)渲染引擎作為Chromium計(jì)劃的一部分，并且在2013年4月的時(shí)候公布了這一消息。這一渲染引擎是開源引擎WebKit中WebCore組件的一個(gè)分支，并且在Chrome（28及往后版本）、Opera（15及往后版本）和Yandex瀏覽器中使用。

瀏覽器內(nèi)核檢測(cè)

• ie.icoa.cn

https://ie.icoa.cn 可檢測(cè) PC 或手機(jī)瀏覽器內(nèi)核和操作系統(tǒng)類型，包括Google Chrome的WebKit、IE的Trident、ME的Edge、Firefox的Gecko/Servo，以及Windows/MacOS/Linux/iOS/Android等的判斷。

• http://mybrowse.osfipin.com

控件1：WebBrowser

微軟WinForm開發(fā)框架中老牌控件。

• 默認(rèn)基于IE7內(nèi)核，對(duì)H5網(wǎng)頁加載支持不完善。
• 只支持單線程模式，大部分對(duì)其操作必須在創(chuàng)建它的線程中執(zhí)行，不可以在其它線程中調(diào)用其方法或?qū)傩浴?/section>
• 性能相對(duì)較弱。

控件2：WebView

WebView 使用原始的 Edge (Trident) 渲染引擎，是 Windows10 唯一的控件，功能、性能不理想。

控件3：Microsoft Edge WebView2*【強(qiáng)烈推薦】*

Microsoft Edge WebView2 控件允許在本機(jī)應(yīng)用中嵌入 web 技術(shù)(HTML、CSS 以及 JavaScript)。WebView2 控件使用 Microsoft Edge(Chromium) 作為繪制引擎，以在本機(jī)應(yīng)用中顯示 web 內(nèi)容。使用 WebView2，可以在本機(jī)應(yīng)用的不同部分嵌入 Web 代碼，或在單個(gè) WebView 實(shí)例中生成所有本機(jī)應(yīng)用。

下圖是在Winform程序中使用WebView2組件加載我的博客園頁面的效果

控件4：CefSharp

CefSharp是一種將功能齊全的符合標(biāo)準(zhǔn)的web瀏覽器嵌入C#或VB.NET應(yīng)用程序的簡(jiǎn)單方法。CefSharp擁有WinForms和WPF應(yīng)用程序的瀏覽器控件，以及自動(dòng)化項(xiàng)目的OffScreen版本。CefSharp基于Chromium Embedded Framework，這是Google Chrome的開源版本。      

         CefSharp中文幫助文檔，請(qǐng)點(diǎn)擊查看

• 免費(fèi)、開源：https://github.com/cefsharp/CefSharp
• 支持JS、C#、WinForm窗體之間相互通訊與調(diào)用。
• 兼容性較好，支持H5、CSS5、WebGL等。
• 支持獲取Cookies較全面。
• 通過NeGet安裝SDK時(shí)，運(yùn)行時(shí)環(huán)境會(huì)被自動(dòng)下載到當(dāng)前項(xiàng)目的bin\debug 或者 bin\Release目錄下。導(dǎo)致整個(gè)項(xiàng)目非常大，大約110M左右。
• 以獨(dú)立進(jìn)程方式運(yùn)行，消耗內(nèi)存較多。
• 當(dāng)控件Dock屬性設(shè)置為 Fill，客戶端電腦的縮放與布局不是100%時(shí)，窗體呈現(xiàn)黑邊（嚴(yán)重bug），并沒有完全填充父容器。

實(shí)際項(xiàng)目應(yīng)用效果如下圖（縮放比例為100%）：

呈現(xiàn)的模型是三維BIM模型，里面用到了HTML5、CSS3、WebGL等新技術(shù)。

控件5：Miniblink

Miniblink是一個(gè)追求極致小巧的瀏覽器內(nèi)核項(xiàng)目，全世界第三大流行的瀏覽器內(nèi)核控件。其基于chromium最新版內(nèi)核，去除了chromium所有多余的部件，只保留最基本的排版引擎blink。Miniblink保持了10M左右的極簡(jiǎn)大小，是所有同類產(chǎn)品最小的體積，同時(shí)支持windows xp、npapi。

• 開源地址：https://github.com/weolar/miniblink49/releases

控件6：GeckoFX

GeckoFX是skybound工作室開發(fā)的一個(gè)開源的用于方便將gecko引擎（最主要的瀏覽器是firefox）鏈接到.net 窗體應(yīng)用的一個(gè)組件。它是用C#寫成的，里面有大量的C#的注釋，geckofx是最完美的默認(rèn)的iE核心webbrowse控件的替代控件。

控件7：DotNetBrowser

DotNetBrowser能嵌入一個(gè)基于Chromium的WPF或WinForms組件到你的.NET應(yīng)用中，用來顯示使用HTML5、CSS3、JavaScript、Silverlight等技術(shù)構(gòu)建的現(xiàn)代網(wǎng)頁。

• 收費(fèi)

控件8：EO.WebBrowser

• 官網(wǎng)：https://www.essentialobjects.com/Products/WebBrowser/Default.aspx
• 收費(fèi)

控件9：Sciter.Forms

Sciter.Forms是基于Sciter桌面引擎的.NET類庫，支持.net framework4.x、.NET CORE、.NET5及更高版本，支持Windows及Linux桌面系統(tǒng)。

• Sciter為桌面UI開發(fā)帶來了一系列web技術(shù)。網(wǎng)頁設(shè)計(jì)師和開發(fā)人員可以在創(chuàng)建外觀現(xiàn)代的桌面應(yīng)用程序時(shí)重用他們的經(jīng)驗(yàn)和專業(yè)技能。
• Sciter允許使用經(jīng)過時(shí)間驗(yàn)證、健壯且靈活的HTML和CSS來定義GUI，并使用GPU加速渲染。
• Sciter引擎是一個(gè)單一的、緊湊的DLL，大小為5+Mb。使用它的應(yīng)用程序比使用Electron或Qt構(gòu)建的應(yīng)用程序小10倍以上。

官網(wǎng)：https://sciter.com/

開源地址：https://gitlab.com/c-smile/sciter-js-sdk