• 给Qt内嵌一个Chrome吧
• CEF简述
• 参考
• 环境准备
• Qt环境
• CEF环境
• 参考
• CEF编译
• 源码
• CEF for Qt
• QMake编译
• cefclient for Qt
• 参考
• 其他链接

给Qt内嵌一个Chrome吧

CEF简述

CEF(Chromium Embedded Framework)，是一个用于开发Web浏览器控件的开源项目，其基于Google Chromium。

参考

1. CEF：给客户端内嵌一个Chrome吧
2. 理解WebKit和Chromium: Content API和CEF3
3. CEF3笔记
4. CEF中文教程

环境准备

Qt环境

• Visual Studio 2010 (not Express edition) (详见参考1)
• Qt libraries 4.8.5 for Windows (VS 2010, 235 MB)
• Visual Studio Add-in 1.1.11 for Qt4

下载，依次安装，尝试建立个Qt工程，运行ok即可。详见参考2。

CEF环境

• Visual Studio 2010 SP1
• Windows 8 SDK
• Jun10 DirectX SDK

运行配置，详见参考3。不过，我并没有安装 Jun10 DX SDK 。

1. 安装 VS10 SP1 ，是因为先前安装了VS2012，编译cefclient时，遇到了 ‘LINK : fatal error LNK1123′ 的问题，详见参考4。
2. 安装 Win8 SDK ，’..\Windows Kits\8.0\Include\winrt\asyncinfo.h’ 66行的 class 需要注释掉，参考3内有详细描述。（不安装，应该也能编译发布版的cef）

参考

1. Visual Studio各版本下载合集
2. QT4.8.5+qt-vs-addin-1.1.11+VS2010安装配置和QT工程的新建和加载
3. Build Instructions (Windows)
4. LINK : fatal error LNK1123

CEF编译

源码

• cef3主分支源码
• cef_binary_3.1547.1412_windows32.7z

cef3主分支源码，可以用TortoiseSVN来获取。不过，我用的是后一个发布版本。更多可见CEF Downloads。

解压cef_xxx.7z，打开cefclient2010.sln，F5编译运行。

CEF for Qt

QMake编译

qmake来编译cef代码。这里新建Qt工程，再将cef代码移过来，进行工程配置。基本步骤如下：

1. 新建Qt工程cefclient，Solution为’qcef’。
2. 右键Solution，追加libcef_dll的Qt static lib工程。
3. 右键Solution > Properties > Common > Dependencies，cefclient depends on libcef_dll。
4. 配置工程的各输出目录，可修改配置有：
   • Project > Properties > Configuration .. > General: Output Directory, Intermediate Directory
   • Qt > Qt Project Settings > Properties: MocDirectory, RccDirectory, UicDirectory
   • VS C++开发时ipch、sdf的输出目录，可如下修改（严重洁癖症患者）:
     • Tools > Options > Text Editor > C/C++ > Advanced > Fallback Location: Ture, True, Output Directory
5. 复制cef的 Debug, Release, include, Resources 到Solution目录下。
   • Debug, Release为发布版cef给我们编译好的lib，include为头文件，Resources为其资源。
6. libcef_dll的代码移过来，Show All Files > Refresh > Delete多余的 > Include所有代码。
7. libcef_dll工程属性配置，之后编译。右键Properties > Configuration ..：
   • General > Character Set: Use Unicode Character Set
   • C/C++ > General > Additional Include ..: + ‘..’(上级目录), 或$(SolutionDir)
   • C/C++ > Preprocessor > Preprocessor Definitions: + ‘NOMINMAX, USING_CEF_SHARED’
8. qcefclient的代码移过来，同libcef_dll一样，之后配置编译：
   • General > Character Set: Use Unicode Character Set
   • C/C++ > General > Additional Include ..: + ‘..’(上级目录), 或$(SolutionDir)
   • C/C++ > Preprocessor > Preprocessor Definitions: + ‘NOMINMAX’
   • Linker > Input > Additional Dependencies:
     • .\..\$(Configuration)\libcef.lib : cef的lib
     • .\..\out\$(Configuration)\lib\libcef_dll.lib : libcef_dll工程的lib
     • opengl32.lib : opengl的lib，或Qt Project Settings > Qt Modules勾选OpenGL library
9. 输出目录缺少cef运行的必要dll等，需要把先前复制的cef的Debug或Release和Resources内的文件复制到输出目录。
   • 可以配置预执行命令，右键Properties > Configuration .. > Build Events > Pre-Build Event > Command Line:
     • xcopy $(SolutionDir)$(Configuration) $(SolutionDir)out\$(Configuration) /e /d
     • xcopy $(SolutionDir)Resources $(SolutionDir)out\$(Configuration) /e /d
     • 有不需要复制的文件，可将其名称放到一个文件里。然后在xcopy命令最后加exclude参数，如’/exclude:$(SolutionDir)exclude.list’。更多xcopy参数。

cefclient for Qt

简单浏览遍cefclient的代码，如下：

• binding_test.cpp
• binding_test.h > 绑定测试：获取进程消息及其回复，与js通信。对应binding.html
• cefclient.cpp
• cefclient.h > 全局方法：cef全局方法，测试方法实现等
• cefclient_osr_widget_win.cpp
• cefclient_osr_widget_win.h > OpenGL渲染窗口组件
• cefclient_win.cpp > 应用程序入口：初始化cef，建立windows窗口等
• client_app.cpp
• client_app.h > CefApp回调处理类：其被传递给了CefExecuteProcess(), CefInitialize()
  • 设计了浏览器委托和渲染器委托流程。后一测试有dom_test，performance_test。
  • 另有自定义协议注册，测试为scheme_test。
  • 这里也注册了js消息调用的扩展，app对象及其方法。
• client_app_delegates.cpp
• client_handler.cpp
• client_handler.h > CefClient回调处理类：其被传递给了CefBrowserHost::CreateBrowser()
  • 设计了进程消息委托流程。测试包括binding_test, dialog_test, window_test。
• client_handler_win.cpp
• client_renderer.cpp
• client_renderer.h > 客户端渲染委托：处理节点焦点事件
• client_switches.cpp
• client_switches.h > 用到的命令行参数：More Switches
• dialog_test.cpp
• dialog_test.h > 对话框测试：对应dialogs.html
• dom_test.cpp
• dom_test.h > dom元素选择测试：对应domaccess.html
• osrenderer.cpp
• osrenderer.h > OpenGL渲染器
• performance_test.cpp
• performance_test.h > V8性能测试：对应performance.html, performance2.html
• performance_test_setup.h
• performance_test_tests.cpp
• resource.h > 资源头文件
• resource_util.h > 资源工具：由名称获取字符串资源、由名称获取资源字节流
• resource_util_win.cpp
• scheme_test.cpp
• scheme_test.h > 自定义协议测试：client://
• string_util.cpp
• string_util.h > 字符串工具：请求信息转为字符串、字符串替换
• util.h > 一些断言宏：检验Cef当前线程类型
• window_test.cpp
• window_test.h > 窗口测试：对应window.html
• window_test_win.cpp

然后，开始动手术，改造为Qt窗口：

直接参见改造后的工程qtcefclient。

参考

1. LNK2001: unresolved external symbol … QMetaObject …
2. CEF3 – Bare Bones
3. Qt决定将Web渲染引擎从WebKit改为Chromium

其他链接

• 浏览器测试工具
• QT下新建windows窗体
• Windows8开发书籍汇总

部分Web引擎框架相关链接

• WebKit
• Chromium

C++

• CEF
• Awesomium

Qt

• QtWebEngine
• Oxide Webview