CEF 桌面软件开发实战-1

在上一讲中，我们对比了几个传统桌面端 GUI 框架和以浏览器为核心的桌面端 GUI 框架，也详细介绍了以浏览器为核心的桌面端 GUI 框架的优势所在，以及 CEF 框架为什么说是以浏览器为核心的桌面端 GUI 框架的佼佼者。不过这样讲完，你对 CEF 框架的了解可能还停留在非常浅的层次上，还会有很多疑问，比如，CEF 为什么成熟稳定？CEF 的商业授权许可到底与其他授权方式有什么不同？搭建一个 C++ 工程有那么多配置项，我们该如何正确地配置 CEF 开发环境？等等。

确实，我们在选择一个技术路线前，最好尽可能多地收集这条技术路线上的各种信息，为我们的技术决策做出准备。另外， C++ 工程配置非常复杂，而且使用的框架不同，配置方式也各有不同，基于 CEF 开发桌面应用就有其独特的配置要求，比如运行库必须配置为 MTD/MT ，而不能是 MD/MDd 等。

所以，这一讲我就为你详细介绍 CEF 框架，包括它的授权机制、约定优于配置的设计原则，以及它比 Electron 等框架优秀的原因，最后我还会带领你基于 CEF 开发框架搭建一个 C++ 的开发环境，为我们将来的课程奠定基础。

CEF 框架介绍

CEF 是 Chromium Embedded Framework 的简写，顾名思义，这是一个把 Chromium 嵌入其他应用的框架。官网地址是： bitbucket.org/chromiumemb… ，这个开源项目是 Marshall Greenblatt 在 2008 年创立的，由 C/C++ 编写而成，它通过提供稳定的 API 来避免开发者被 Blink、V8、Chromium 等复杂的代码逻辑所困扰。CEF 非常注重开发者的使用体验，很多功能都有默认实现方式，遵从约定优于配置的原则，开发者可以很轻松地驾驭 CEF 框架。

据 CEF 官网数据，CEF 框架装机量超过 1 亿，但依我看这个数据过于保守了，毕竟很多大家耳熟能详的桌面端应用都在使用 CEF 框架：QQ 桌面端、微信桌面端、网易云音乐桌面端、 MATLAB 、 FoxMail 、OBS Studio 等。也就是说，很多人的电脑上不止有一个 CEF 框架支持的项目。

CEF 是一个商业授权非常友好的开源项目（这也是那么多大厂都用它做界面的原因之一吧），它采用的是 BSD 授权协议，也就是说如果你基于 CEF 开发了商业软件，只要满足以下两点要求你就可以随意使用 CEF 框架的二进制文件和源码。

1. 把 CEF 的授权协议文件打包到你的软件中再分发给用户（也就是 LICENSE.txt ），如果是开源项目的话，源码中也得包含 CEF 的授权协议。
2. 不要使用谷歌、Chromium、CEF 及其作者的名字宣传你的软件。

CEF 用途广泛，比较常见的就是直接用 CEF 开发桌面应用，比如网易云音乐、微信桌面端，但也有一些开发者把 CEF 当作一个浏览器控件嵌入到自己的应用中。还有开发者使用 CEF 的浏览器核心做 Web 的测试工具，或者使用 CEF 的离屏渲染能力做网页采集工具。

CEF 虽然是用 C/C++ 开发的，但社区为它提供了很多其他语言的绑定，比如， Go 、 Java 、 Python 等，具体链接如下：

• .Net (CEF3) - github.com/cefsharp/Ce…
• Go - github.com/CzarekTomcz…
• Java - bitbucket.org/chromiumemb…
• Python - code.google.com/p/cefpython…

但这些都是社区提供的，更新频率和项目质量都是需要担心的问题，我们这个小册是基于 C++ 完成的，并没有使用这些开源项目。

CEF 不像 Electron 和 NW.js，并没有过多地干扰 Chromium 的执行流程，也没有为 Chromium 绑定其他重型框架，所以 CEF 的执行效率比 Electron 和 NW.js 更高，而且运行更稳定。这是很多软件厂商选择 CEF 的另一个原因。

了解了 CEF 的基本情况之后，你是不是迫切地想体验一下 CEF 框架呢？接下来我们就介绍如何编译并运行 CEF 提供的 Demo 项目。

选择 CEF SDK

首先，下载 CEF 框架：cef-builds.spotifycdn.com/index.html#… 。

CEF 官方在这个页面给出了多种操作系统下的框架文件，由于我们是基于 Windows 操作系统介绍 CEF 框架，所以就下载 Windows 版本的框架文件（如果你是使用的其他操作系统，不用担心哈，这些操作步骤都是类似的）。

这里我选择了 Windows 64 位框架文件。如果你开发的应用程序需要兼容 Windows 32 位操作系统（已经很少人使用这类操作系统了），那么你应该下载 Windows 32 位的二进制文件。32 位的应用程序可以安装在 64 位的操作系统上，但 64 位的应用程序不能安装在 32 位的操作系统上。目前仍有很多知名应用只提供 32 位版本的程序，但由于 32 位应用程序有诸多限制（比如可访问的内存比 64 位应用程序要少很多），我还是推荐你主推 64 位的应用程序，32 位的应用程序作为补充。

另外，下载页面还包括两个分类：

• Current Stable Build (Preferred) ，这是当前稳定版本；
• Current Beta Build (For Testing) ，这是尚处于测试中的 beta 版本。

我们当然选择当前稳定版本，然而值得注意的是：由于 Chromium 和 CEF 都更新得非常频繁，所以即使是当前稳定版本，也难免会有一些问题，如果遇到由于版本太新而导致的问题，可以点击此页面左下角 Show All Builds 来选择历史版本。

Debug Symbols 和 Release Symbols 是为调试崩溃报告服务的符号文件，我们暂时用不到这些文件，不用下载。

Standard Distribution 相对于 Minimal Distribution 来说，多包含了调试文件和示例代码文件，我们这里选择 Standard Distribution。

下载成功后，得到 cef_binary_94.4.10+g38a7995+chromium-94.0.4606.81_windows64.tar.bz2 （此处给出的版本号可能与你实际下载的版本号不同），我们把这个压缩文件解压后放到一个目录下，比如 cef，接下来就是在这个目录下完成编译 CEF 的工作了。

编译运行 CEF 示例项目

我们这里按照官方的指导，使用 CMake 工具来编译 CEF。

首先下载并安装 CMake 工具： cmake.org/download/ 。它内置了 cmake-gui 工具，我们使用这个工具来构建 CEF 的 VisualStudio 工程，在 Where is the source code 和 Where to build the binaries 设置好相应的目录，点击 Configure 按钮，配置工程，再点击 Generate 生成工程文件。如下图所示：

执行过程中，可能会要求你选择 Visual Studio 的版本，选择你电脑上已经装好的 Visual Studio 版本即可（我们小册介绍的内容在 VS2019 和 VS2022 下验证过），另外可能会提示一个警告，不用担心，Generate 完成后会在你配置的 build 目录下（Where to build the binaries）生成 Visual Studio 的工程文件：cef.sln。

Make sure HKLM\Software\Microsoft\Windows Kits\Installed Roots@KitsRoot10 is set to:

C:\Program Files  (x86) \Windows Kits\10\

and NOT:

C:\Program Files\Windows Kits\10\

打开这个文件就启动 Visual Studio 并打开了我们刚刚配置的这个工程，或者点击 cmake-gui 工具中的 Open Project 按钮，也会打开这个工程。

在 Visual Studio 的解决方案资源管理器中，把 cefsimple 项目设为启动项目，并启动这个项目的新实例，如下图所示：

 如果你现在没有处于网环境中，那么你大概率会看到 Visual Studio 启动了一个新窗口，这个窗口内显示了下面一行文字：

Failed to load URL www.google.com/ with error ERR_CONNECTION_TIMED_OUT (-118) .

此时我们打开：cef\tests\cefsimple\simple_app.cc，修改 105 行的代码，把 google.com 改成 juejin.cn，再次启动项目，你就会看到如下窗口了。

 多测试几次，观察窗口的启动速度，是不是比 Electron 的窗口启动速度要快很多呢？！^_^

我们启动的这个项目是 CEF 的一个示例项目，虽然没几个 C++ 文件，但涉及到的概念还是挺多的，你看不懂里面的代码没有关系，我们在后续的章节还会准备一个更精简的入门项目，带领你由浅入深地学习 CEF 框架。

除此之外，工程内还有另外一个 Demo 项目：cefclient ，你也可以按照上面描述的步骤启动一下看看效果，这个项目就复杂得多了，如果你刚刚入门 CEF，建议你暂时不要读 cefclient 的源码。

虽然能成功运行 CEF 的 Demo 项目了，但这个项目毕竟不是自己的，我们也无法在这些示例项目上开发自己的产品，那么接下来我就带领你再创建一个属于自己的全新 CEF 工程。

搭建全新的 CEF 工程

很多开发者都会被 C++ 工程繁复的配置拒之门外，今天我就详细介绍一下如何配置 CEF C++ 工程。

使用 Visual Studio 创建 C++ 项目还是比较简单的，这里简要介绍一下：首先使用 Visual Studio，创建一个全新的 C++ 空项目，我给它取名 ceftest，你可以按照自己的意愿取名；接下来，我们在工程中添加一个文件 main.cpp 的 C++ 程序文件，暂时先不必为 main.cpp 撰写代码，我们先把工程配置好（这个文件对接下来的工程配置是有帮助的，如果工程中没有一个 cpp 文件的话，VisualStudio 是不会出现 C/C++ 配置属性的）。

1. 配置工程

接下去是我们重点介绍的内容：如何配置 CEF 工程？先打开项目的属性页面：

 这里属性窗口有一点需要注意，我们在配置选择框和平台选择框中选择 Debug 和 Release 或者 x64 和 Win32 ，都意味着不同的配置项。也就是说，我们为 Debug 环境做的配置是与 Release 环境的配置不同的，现在我们以 Debug+x64 环境为例介绍配置内容，配置以下几项内容即可。

• “常规->C++语言标准”设置为：ISO C++17 标准 ( /std:c++17 )，这个配置可以使我们在工程中使用现代 C++ 的语言特性。
• “C/C++ ->常规->附加包含目录”设置为： E:\project\cef; ，这个路径是你下载的 CEF 框架所在的路径。注意：在使用 CEF 框架前你必须已经成功编译了 CEF 的示例项目。
• “C/C++ ->常规->预处理器定义”设置为如下内容： 

WIN32
_WINDOWS
__STDC_CONSTANT_MACROS
__STDC_FORMAT_MACROS
_WIN32
UNICODE
_UNICODE
WINVER=0x0601
_WIN32_WINNT=0x601
NOMINMAX
WIN32_LEAN_AND_MEAN
_HAS_EXCEPTIONS=0
PSAPI_VERSION=1
CEF_USE_SANDBOX
CEF_USE_ATL
_HAS_ITERATOR_DEBUGGING=0
_SILENCE_ALL_CXX17_DEPRECATION_WARNINGS

这些预处理器定义大部分都是 Windows 平台和 CEF 框架要求的预处理器定义，最后一项是为了屏蔽 CEF 框架中低版本 C++ 警告的预处理器。

• “C/C++ ->代码生成->运行库”设置为：多线程调试 (/ MTd )，这是为了适配 Chromium 的调试方式而设置的。
• “链接器->输入->附加依赖项”设置为如下内容： 

E:\project\cef\build\libcef_dll_wrapper\Debug\libcef_dll_wrapper.lib
E:\project\cef\Debug\libcef.lib
E:\project\cef\Debug\cef_sandbox.lib
comctl32.lib
gdi32.lib
rpcrt4.lib
shlwapi.lib
ws2_32.lib
Advapi32.lib
dbghelp.lib
Delayimp.lib
OleAut32.lib
PowrProf.lib
Propsys.lib
psapi.lib

这是在编译、链接我们的程序时，使用 CEF 和 Windows 库的配置，其中 E:\project\cef 是你下载的 CEF 框架所在的路径。

• “链接器->系统->子系统”设置为：窗口 ( /SUBSYSTEM:WINDOWS )，VisualStudio 创建空白项目时，默认是控制台项目，这里我们把它调整为窗口项目。
• “清单工具->输入和输出->附加清单文件”设置为：$(ProjectDir)ceftest.manifest，这是为了让我们的工程生成的可执行程序兼容不同版本的 Windows 操作系统。设置好此配置之后，需要在工程的根目录下（与 main.cpp 在同一个目录）创建一个名为 ceftest.manifest 的文件，代码如下（此处的文件名你也可以按照自己的想法命名，不过注意配置里的文件名要和实际的文件名一致哦）：

<?xml version="1.0" encoding="utf-8"?>
<assembly xmlns="urn:schemas-microsoft-com:asm.v1" manifestVersion="1.0">
        <compatibility xmlns="urn:schemas-microsoft-com:compatibility.v1">
                <application>
                        <!--The ID below indicates application support for Windows 8.1 -->
                        <supportedOS Id="{1f676c76-80e1-4239-95bb-83d0f6d0da78}"/>
                        <!-- 10.0 -->
                        <supportedOS Id="{8e0f7a12-bfb3-4fe8-b9a5-48fd50a15a9a}"/>
                </application>
        </compatibility>
</assembly>

至此，这个全新的 C++ 工程就配置成功了，但现在还无法使用它，接下来我们就介绍如何为新工程准备资源。

2. 准备资源

配置好这个全新的工程后，我们还需要把 CEF 的二进制资源拷贝到工程的输出目录下，只有这样这个新工程才能正确调用 CEF 框架提供的API。

我们在上面“编译运行 CEF 示例项目”小节，已经成功运行了 CEF 框架自带的示例项目，这个示例项目的输出目录下，这里有我们需要的 CEF 二进制资源，如下图所示（这些文件并不全都是必须的，你可以根据文件的作用裁剪掉某些文件，这部分内容我们后续章节会有介绍）：

 你需要把上述二进制资源文件，拷贝到 “E:\project\ceftest\x64\Debug” 目录下， ceftest 就是我们这个新工程所在的目录，需要注意的是，这个路径目前可能还不存在，你可以自行创建一下这个目录。

至此，开发环境就配置好啦。下一节我们将在这个工程上创建一个最精简的 CEF 项目，并向你展示 CEF 框架的一些基本操作。

另外，准备发布的应用程序，是要通过 Release 模式编译出来的，咱们的工程在 Release 模式的配置与 Debug 模式的配置略有不同，我们将在后续章节讲解。Win32 和 x64 的配置没有区别。

总结

这一讲介绍的内容虽然与 CEF “开发”关系不是特别大，但却是必不可少的。因为不全面了解 CEF ，就没办法确认这条技术路线是否是坦途，不熟练掌握工程配置步骤，就没办法娴熟地搭建一个又一个 CEF 项目（在将来的实践中，相信你会时常因为要验证一个 CEF 的新特性而搭建一个工程）。并且我们今天创建 CEF 项目的一些配置，在其他 C++ 工程中也非常常见，希望你在学习之余，也能仔细了解一下这些配置项的具体含义，这对你深入理解 Windows 应用程序的运行机制很有帮助。

万里之行始于足下，下一讲我们将基于本节创建的工程实现一个简单到不能再简单的 CEF 项目，希望我能以最平缓的学习曲线带领你进入 CEF 应用开发的世界。

 

原文地址：https://juejin.cn/book/7075387142121193502/section/7075567045340823565