用WEB方式開發WPF桌面程式

2020 年 8 月 18 日
筆記

　　因為疫情影響，公司裁員，結束了一年多的web開發經歷，重新開始做桌面，新公司用的是WPF（居然用的是winform style。。。），當然這跟本文沒有關係。。。上篇部落格寫的用後台api和前台瀏覽器控制項的方式來做桌面程式，這篇文章用nancy+cefsharp實現了一種方式，使用WPF的原因是因為winform在高解析度螢幕上會有問題，cefsharp會顯示黑邊，雖然可以解決，但始終不是很好的感覺。演示介面如下：

後端API

　　nancy是一種web後端框架，現在已經不再維護，但是功能應該說已經很完善了

        void InitWeb()
        {
            var hostConfigs = new HostConfiguration
            {
                UrlReservations = new UrlReservations() { CreateAutomatically = true },
                MaximumConnectionCount = 1
            };

            Uri uri = new Uri("//localhost:8888");
            var host = new NancyHost(hostConfigs, uri);
            host.Start();
        }

　　給nancy添加靜態頁面路徑

    public class Bootstrapper : DefaultNancyBootstrapper
    {
        protected override void ConfigureConventions(NancyConventions nancyConventions)
        {
            base.ConfigureConventions(nancyConventions);
            nancyConventions.StaticContentsConventions.Add(StaticContentConventionBuilder.AddDirectory("", "/web"));
            //nancyConventions.StaticContentsConventions.Add(StaticContentConventionBuilder.AddDirectory("Scripts", "/Scripts"));
        }
    }

　　添加api響應函數

    public class HomeModule : NancyModule
    {
        
        public HomeModule()
        {
            Get("/", x => "Hello World!");
        }
    }

　　至此，後端api基本完成了，額外功能可以自行添加，這裡只做個演示

前端網頁顯示

　　這裡使用CefSharp，也就是Google瀏覽器內核的封裝，也可以用自帶的IE內核，但是考慮對前端框架，比如vue這些的支援，還是Google內核好一點，除了dll有點大（是特別大，最新版120M！），在WPF添加瀏覽器。注意需要設置工程為X64/X86，否則會報錯。

    <Grid>
        <cefSharp:ChromiumWebBrowser Address="//localhost:8888" Name="chrome"/>
    </Grid>

　　好了，然後F5運行即可。

　　本文只是給出了一個大致的結構思路，算是完成了上篇部落格的想法，如果公司沒有專業的桌面端開發，可以讓WEB頂上（壓榨）！在這裡也給出在GITHUB上找到的另一個用web做前端的庫：//github.com/NeutroniumCore/Neutronium ，這個庫是用WPF的做後端，直接和網頁交互，看上去還不錯的感覺，有興趣的可以試一試。

源碼：點我下載