[Asp.Net Core] Blazor Server Side 扩展用途 - 配合CEF来制做客户端浏览器软件

前言

你们用过微信PC端吧? 这是用浏览器作的. 

用过Visual Studio Code吧? 也是用浏览器作的. 

据说, 暴雪客户端也包含浏览器核心?? 

在客户端启动一个浏览器, 并非什么难事了. 

 

如今既然用开了Blazor server side技术 , 

那么固然是也想用Blazor server side来作客户端软件了. 

没错, 的确是Blazor server side技术. 客户端也可使用这技术的. 

 

虽然如今有不少各类各样用于 DotNet 的 CEF 框架, 可是大部分尚未一步到位.

此次要作的是, 打算弄一个开源项目, 作成 DotNet 的 dll , 生成项目模板, 让开发者直接用上. 

(本教程包含 C++部分, 但后续的开源项目, 会去掉C++部分, 只剩下一个CppInterop.dll 和项目模板)

 

开发者难度:

    当这个模板作好以后, 对于初步用途来讲, 没有难度. 开发者能够直接复制模板, 而后在模板上加入本身的代码即可. 

    和通常的CEF C#框架不同, 这边不是针对浏览器技术, 而是针对开发者最经常使用的几个功能去考虑, 直接作好简单易用的API 

 

目标与好处

1. 开发者下载到项目模板以后, 用VS2019打开, 直接编译直接运行. 不要再搞那些复杂的玩意了. 
2. 在用户的电脑上运行 Asp.Net Core 网站, 而且自启浏览器去显示. 
3. 又或者, 向客户提供一个特殊的浏览器, 知足网站的扩展权限功能. 
4. 开发者能够像作网站同样作客户端程序. 
5. 不限定 Blazor , 能够是 Mvc, 甚至是ReactJS/ArgularJS/VueJS/jQuery等都OK的. 
6. 能保证浏览器的版本, 不用考虑浏览器兼容性问题
7. Asp.Net Core在客户端运行, 拥有客户端PC的权限, 能够随意操做用户电脑的文档, 
8. 方便地与客户端的各类程序进行操做, 例如按需启动客户端程序编辑内容, 编辑完再继续处理.
9. 键盘给你们, 你们本身写...

概念思考

1. 因为是客户端程序, 因此全部的资源已经打包好了. 除非要访问服务器进行交互下载, 不然正常的功能是无延迟无网络中断问题的. 
2. 理论上整合了C++的部分, 是能够整合各类C++玩意, 例如把ActiveX整合进程序的.(非整合进浏览器)
3. .....

 

---

 

如下整合步骤只给有C++经验的人士观看.  其余人等这个项目的成品出来即可. 

整合步骤 

CEF项目地址 : https://github.com/chromiumembedded/cef

CEF下载地址 http://opensource.spotify.com/cefbuilds/index.html , 找到 Windows 32位的版本, 这样能够兼容性更好

 

 下载后, 解压到更短的路径, 由于后面要使用 . 

         

 

 进入 https://cmake.org/ , 下载 : CMake , 而后运行, 输入目录, 与输出目录(生成 VS2019 Solution).

 

 配置:

 

 

 

 提示有错吗? 无论. 直接点多一次 Generate 即可. 

---

 

注意, VISUAL STUDIO 2019 必须安装 C++ 和 C++ CLI 

打开工程, 配置编译.   咱们只需编译这些玩意:  (或者把那几个不用的工程删掉算了)

 

 先编译一次, 应该会经过.  

 

 

在下载的文件里面, 找到这4个文件 , C++很差写, 可是咱们能够在样板工程上直接改. 

 复制到 libcef_dll_wrapper 工程目录下, 而且添加现有项 : 

 

 

 修改 simple_app.cc  , 在16行插入

std::string _surl;
std::string GetStartupUrl()
{
    return _surl;
}


void SetStartupUrl(LPTSTR url)
{
    char chars[2048];
    int cch = WideCharToMultiByte(936, 0, url, -1, 0, 0, NULL, NULL);
    WideCharToMultiByte(936, 0, url, -1, chars, cch, NULL, NULL);
    _surl = chars;
}

int RunCefApp(LPTSTR cmdline)
{
    HINSTANCE hinst = (HINSTANCE)GetModuleHandle(NULL);
    wWinMain(hinst, NULL, cmdline, 0);
    return 0;
}

找到 command_line->GetSwitchValue("url") 这一行, 把启动Url 换掉 , 这样后面 SetUrl 就有效果啦.

 

编译, 经过. 

 

 CppInterop工程

 

 新增一个C++ CLI工程 (注意, CLI没打错字, CLI和CLR概念不同, 请自行搜索)

 

 项目名称 CppInterop 好了. 

 添加引用

 

 

添加 libcef.lib ,  Debug的用  cef32\Debug\libcef.lib ,  Release的用  cef32\Release\libcef.lib

 

修改 CppInterop.cpp

#include "pch.h"

#include <Windows.h>

using namespace System; void SetStartupUrl(LPTSTR url); int RunCefApp(LPTSTR cmdline); WCHAR cscmd[4096]; WCHAR csurl[4096]; namespace CppInterop { public ref class Cpp { public: static void SetUrl(String^ url) { for (int i = 0; i < url->Length; i++) csurl[i] = url[i]; csurl[url->Length] = '\0'; SetStartupUrl(csurl); } static int Run(String^ cmdline) { for (int i = 0; i < cmdline->Length; i++) cscmd[i] = cmdline[i]; cscmd[cmdline->Length] = '\0'; return RunCefApp(cscmd); } }; }

 

 

编译 CppInterop工程.  经过. 

自此, C++部分已经完结. 

---

 

BlazorApp1

新建dotnetcore Blazor Server 工程 ,  添加对 CppInterop 的引用, 

不管是 Debug或Release , 都修改成 x86架构

 

程序入口改成:

        [STAThread]
        public static void Main(string[] args)
        {
            string cmdargs = string.Join(" ", args);

            if (cmdargs.Contains("--type="))
            {
                CppInterop.Cpp.Run(cmdargs);
                return;
            }

            System.Threading.CancellationTokenSource cts = new System.Threading.CancellationTokenSource();
            var tsk = CreateHostBuilder(args).Build().RunAsync(cts.Token);
            CppInterop.Cpp.SetUrl("https://localhost:5001");
            CppInterop.Cpp.Run(cmdargs);
            cts.Cancel();
            tsk.Wait(3000);
        }

 

 

不要用IIS启动了, 必须用exe方式启动:

 

 

 把 D:\Temp\cef32\Resources 和 D:\Temp\cef32\Debug  复制到输出文件夹 

 

 启动项目: 

 

 

Edge浏览器正常,  可是本身启动的浏览器没法启动子进程渲染器,  缘由是 COM thread model 有问题. 估计是Debug模式的问题. 

解决方法有两种,   一种是使用参数 --single-process 启动 :

 

 

 

 这种模式好啊.  只有1个进程. 

 

另一种模式是 , 编译为Release 再执行 : 

 

 

 去掉 --single-process的效果:

 

 这个和通常的浏览器的行为一致了. 

 

显示控制台, 有助于查看调试信息. 

若是不想控制台弹出来, 能够把工程的属性改掉. 从 '控制台应用程序' 改为 'Windows应用程序'

 

---

 

结尾

目前先记录到这里. 

后面还有一大堆要和浏览器进行交互的事情. 

对于开发者来讲, 目前考虑有如下需求须要解决:

1 - C# 代码能控制窗口的大小 , 最大化, 最小化等等.  例如启动时固定大小, 登陆后, 自动最大化. 

2 - C# 代码能够本身实现一些下载的功能,  

3 - 能够自定义方式弹出DevTools,

4 - 如何另外弹出WinForms, WPF界面. 

5 - 如何与真正的服务器进行通讯, 如何下载服务器的dll执行. 

...