QCefView编译配置(Windows-MSVC)(11) 原创
QCefView编译配置(Windows-MSVC)
文章目录
更多精彩内容 |
---|
👉个人内容分类汇总 👈 |
👉Qt - Web混合开发👈 |
1、概述
-
什么是CEF
Chromium嵌入式框架(CEF)是一个简单的框架,用于在其他应用程序中嵌入基于Chromium的浏览器。
CEF是由Marshall Greenblatt于2008年创立的BSD许可开源项目,基于Google Chromium项目。与主要专注于Google Chrome应用程序开发的Chromium项目本身不同,CEF专注于促进第三方应用程序中的嵌入式浏览器用例。CEF 通过提供生产质量的稳定 API、跟踪特定 Chromium 版本的发布分支和二进制发行版,将用户与底层 Chromium 和 Blink 代码的复杂性隔离开来。CEF 中的大多数功能都有默认实现,这些实现提供丰富的功能,同时用户几乎不需要集成工作。
-
什么是QCefView
QCefView是为Qt框架开发的一个封装集成了Chromium Embedded Framework库的Wdiget UI组件。使用QCefView可以充分发挥CEF丰富强大的Web能力,快速开发混合架构的应用程序。
- 使用Qt开发者熟悉的Forms,signal/slot来开发应用
- 方便直观的Javascript/C++互操作方式
-
为何选择QCefView而不用Electron?
从设计思路和最终形态来讲QCefView和Electron是完全不同的技术。
- QCefView只是一个为Qt框架开发的UI组件,Electron则是一个功能完备的应用开发框架
- QCefView是为Native系统开发者设计的,Electron对前端开发者更友好
- QCefView使用C++作为主要开发语言,Electron全部基于Javascript
- QCefView提供便捷直观的Javascript/C++互操作方式,Electron通过编写插件实现Web/Native互操作
-
CEF和QWebEngineView的优缺点
CEF(Chromium Embedded Framework)和QWebEngineView都是用于在应用程序中嵌入浏览器的框架,它们都有一些优缺点:
CEF的优点:
- 功能丰富:CEF提供了许多API和插件,可以自由地定制和扩展浏览器功能。
- 跨平台支持:CEF可以在Windows、Linux和Mac OS X等多个平台上使用。
- 性能优秀:CEF使用Chromium作为底层引擎,具有优秀的性能和稳定性,可以提供快速的Web浏览体验。
- 灵活性高:CEF可以嵌入到任何C/C++应用程序中,无需安装额外的软件和插件,因此可以减少应用程序的大小和依赖性。
- 安全性好:使用CEF可以避免一些安全漏洞,例如XSS(跨站脚本)和CSRF(跨站请求伪造)等。
CEF的缺点:
- 学习成本高:使用CEF需要掌握一定的C/C++编程知识和Chromium浏览器的相关知识。
- 功能复杂:CEF提供的功能非常丰富,需要开发者有一定的技术水平才能使用。
QWebEngineView的优点:
- 简单易用:QWebEngineView提供了一些基本的API,易于学习和使用。
- 集成性强:QWebEngineView是Qt框架的一部分,可以与其他Qt组件进行无缝集成。
- 跨平台支持:QWebEngineView可以在Windows和Linux等多个平台上使用。
- 功能适中:QWebEngineView提供了一些常用的浏览器功能,例如访问URL、设置Cookie和JavaScript交互等。
QWebEngineView的缺点:
- 功能相对简单:QWebEngineView提供的功能相对CEF来说比较简单,无法满足一些高级的定制需求。
- 性能较低:QWebEngineView相对于CEF来说性能较低,可能会影响应用程序的运行速度。
- 跨平台支持不够广泛:QWebEngineView虽然支持多个平台,但不如CEF来得广泛。
综上所述,CEF和QWebEngineView都有各自的优缺点,开发者需要根据自己的需求和技术水平进行选择。
-
推荐用CEF而不是QWebEngineView
QWebEngineView作为Qt框架的一部分,虽然功能相对简单,但仍然存在一些已知的bug,例如:
- 内存泄漏:在某些情况下,QWebEngineView使用过程中可能会出现内存泄漏的问题,导致应用程序运行缓慢或崩溃。
- 渲染错误:在某些情况下,QWebEngineView可能无法正确地渲染Web页面,导致页面显示异常或崩溃。
- 兼容性问题:由于QWebEngineView基于QtWebEngine浏览器引擎,与其他浏览器可能存在一些兼容性问题,例如某些Web页面无法正确地显示或运行。
- 线程安全问题:QWebEngineView在多线程环境下可能存在一些线程安全问题,需要开发者注意。
- 其他问题:QWebEngineView可能还存在其他一些已知或未知的问题,需要开发者注意。
QWebEngineView在使用过程中可能会出现显卡驱动问题,主要表现为页面渲染异常、速度慢等。这是因为QWebEngineView使用了GPU加速技术,需要显卡驱动支持才能正常工作。
如果出现这种问题,可以尝试以下解决方法:
-
更新显卡驱动:更新显卡驱动可以解决一些显卡兼容性问题,提高QWebEngineView页面渲染速度。可以从显卡厂商的官方网站下载最新的驱动程序。
-
禁用GPU加速:在某些情况下,禁用GPU加速可以解决QWebEngineView页面渲染异常的问题。可以通过在应用程序中添加以下代码实现:
QCoreApplication::setAttribute(Qt::AA_DisableHighDpiScaling); QCoreApplication::setAttribute(Qt::AA_UseOpenGLES); QCoreApplication::setAttribute(Qt::AA_ShareOpenGLContexts); QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
-
更改GPU加速方式:在某些情况下,更改GPU加速方式可以解决QWebEngineView页面渲染异常的问题。可以通过在应用程序中添加以下代码实现:
QCoreApplication::setAttribute(Qt::AA_UseSoftwareOpenGL);
需要注意的是,如果禁用或更改GPU加速方式,可能会影响QWebEngineView的性能和体验。因此,建议在尝试以上解决方法之前,先备份应用程序数据,以免出现不可逆的问题。
虽然QWebEngineView存在一些bug,但Qt框架的开发者们一直在积极地修复和改进这些问题。开发者在使用QWebEngineView时,需要注意这些问题,并尽可能避免这些问题的出现。
2、准备工作
-
Qt版本:Qt5.12.5
-
编译器:MSVC2017-64
-
可以下载我打包好的QCefView+CefViewCore+cef源码
-
可以下载我编译好的库文件
-
CMake:QCefView通过CMake管理项目构建,所以请先安装CMake。最低要求版本为3.19.1,推荐使用最新版本。
-
CefViewCore:
-
我选择的版本:
-
下载命令:
git clone https://github.com/CefView/CefViewCore.git
-
-
QCefView:
-
我选择的版本:
-
下载命令:
git clone https://github.com/CefView/QCefView.git
-
-
将CefViewCore下载后拷贝到QCefView文件夹下
3、添加环境变量
-
第一步需要添加QTDIR环境变量,否则CMAKE构建时会报错;
-
在开始菜单搜索【环境变量】
-
打开【系统属性】窗口,点击【环境变量】按键;
-
点击【新建】,变量名输入【QTDIR】,变量值输入【D:\Qt\Qt5.12.5\5.12.5\msvc2017_64】
4、更换cef源码版本
-
MSVC-2017编译器不支持编译新版本的cef,经过测试,可以选择【91.0.4472.164】以下版本;
-
打开CefViewCore文件夹下的CefConfig.cmake文件,将高版本的注释掉,取消91版本的注释;
5、CMake构建
-
创建一个build文件夹,打开CMake,将QCefView文件夹下的CMakeLists.txt拖入CMake中,然后将构建生成路径设置为创建的build文件夹;
-
点击【Configure】,编译器选择【Visual Studio 15 2017,X86】,然后点击【Finsh】;
-
这时候如果网络不好或者离线环境则会卡在下列这一步,这是在自动下载cef源码,如果网络不好就会下载失败;
-
可以复制
https://cef-builds.spotifycdn.com/cef_binary_91.1.23+g04c8d56+chromium-91.0.4472.164_windows64.tar.bz2
到浏览器或者迅雷中下载,下载完成后拷贝到QCefView\CefViewCore\dep
文件夹下,然后点击【Configure】,就会自动解压cef源码; -
勾选【BUILD_DEMO】可以同时编译生成cef的示例程序(可以不勾选);
-
修改编译后的安装路径【CMAKE_INSTALL_PREFIX】;
-
点击【Configure】->【Generate】->【Open Project】,自动打开VS;
6、Visual Studio编译
-
鼠标右键选择【ALL_BUILD】->【生成】;
-
编译后会报下列错误信息;
严重性 代码 说明 项目 文件 行 禁止显示状态 错误 C2660 “CefWindowInfo::SetAsChild”: 函数不接受 5 个参数 QCefView C:\Users\mhf\Desktop\Test\QCefView\src\details\QCefViewPrivate.cpp 102
-
双击错误信息转至报错位置,可以看出这里时通过判断cef的版本宏 是否91版本;
-
鼠标选中报错的
SetAsChild
函数,右键选择【转到定义】; -
可以发现函数定义只有两个参数,而我们选择的CEF版本是【91.1.23】,实际上是大于91的版本,这里宏判断有一点bug;
-
将
#if CEF_VERSION_MAJOR > 91
改为#if CEF_VERSION_MAJOR >= 91
,然后【重新生成】就可以编译了;
7、安装编译后的文件
-
鼠标右键选择【INSTALL】->【生成】;
8、验证编译结果
-
由于在CMake构建时指定了安装路径为
E:/QCefView
,所以安装后如下所示; -
进入QCefViewTest文件夹下,双击运行QCefViewTest.exe;