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的优点:

    1. 功能丰富:CEF提供了许多API和插件,可以自由地定制和扩展浏览器功能。
    2. 跨平台支持:CEF可以在Windows、Linux和Mac OS X等多个平台上使用。
    3. 性能优秀:CEF使用Chromium作为底层引擎,具有优秀的性能和稳定性,可以提供快速的Web浏览体验。
    4. 灵活性高:CEF可以嵌入到任何C/C++应用程序中,无需安装额外的软件和插件,因此可以减少应用程序的大小和依赖性。
    5. 安全性好:使用CEF可以避免一些安全漏洞,例如XSS(跨站脚本)和CSRF(跨站请求伪造)等。

    CEF的缺点:

    1. 学习成本高:使用CEF需要掌握一定的C/C++编程知识和Chromium浏览器的相关知识。
    2. 功能复杂:CEF提供的功能非常丰富,需要开发者有一定的技术水平才能使用。

    QWebEngineView的优点:

    1. 简单易用:QWebEngineView提供了一些基本的API,易于学习和使用。
    2. 集成性强:QWebEngineView是Qt框架的一部分,可以与其他Qt组件进行无缝集成。
    3. 跨平台支持:QWebEngineView可以在Windows和Linux等多个平台上使用。
    4. 功能适中:QWebEngineView提供了一些常用的浏览器功能,例如访问URL、设置Cookie和JavaScript交互等。

    QWebEngineView的缺点:

    1. 功能相对简单:QWebEngineView提供的功能相对CEF来说比较简单,无法满足一些高级的定制需求。
    2. 性能较低:QWebEngineView相对于CEF来说性能较低,可能会影响应用程序的运行速度。
    3. 跨平台支持不够广泛:QWebEngineView虽然支持多个平台,但不如CEF来得广泛。

    综上所述,CEF和QWebEngineView都有各自的优缺点,开发者需要根据自己的需求和技术水平进行选择。

  • 推荐用CEF而不是QWebEngineView

    QWebEngineView作为Qt框架的一部分,虽然功能相对简单,但仍然存在一些已知的bug,例如:

    1. 内存泄漏:在某些情况下,QWebEngineView使用过程中可能会出现内存泄漏的问题,导致应用程序运行缓慢或崩溃。
    2. 渲染错误:在某些情况下,QWebEngineView可能无法正确地渲染Web页面,导致页面显示异常或崩溃。
    3. 兼容性问题:由于QWebEngineView基于QtWebEngine浏览器引擎,与其他浏览器可能存在一些兼容性问题,例如某些Web页面无法正确地显示或运行。
    4. 线程安全问题:QWebEngineView在多线程环境下可能存在一些线程安全问题,需要开发者注意。
    5. 其他问题:QWebEngineView可能还存在其他一些已知或未知的问题,需要开发者注意。

    QWebEngineView在使用过程中可能会出现显卡驱动问题,主要表现为页面渲染异常、速度慢等。这是因为QWebEngineView使用了GPU加速技术,需要显卡驱动支持才能正常工作。

    如果出现这种问题,可以尝试以下解决方法:

    1. 更新显卡驱动:更新显卡驱动可以解决一些显卡兼容性问题,提高QWebEngineView页面渲染速度。可以从显卡厂商的官方网站下载最新的驱动程序。

    2. 禁用GPU加速:在某些情况下,禁用GPU加速可以解决QWebEngineView页面渲染异常的问题。可以通过在应用程序中添加以下代码实现:

      QCoreApplication::setAttribute(Qt::AA_DisableHighDpiScaling);
      QCoreApplication::setAttribute(Qt::AA_UseOpenGLES);
      QCoreApplication::setAttribute(Qt::AA_ShareOpenGLContexts);
      QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
      
    3. 更改GPU加速方式:在某些情况下,更改GPU加速方式可以解决QWebEngineView页面渲染异常的问题。可以通过在应用程序中添加以下代码实现:

      QCoreApplication::setAttribute(Qt::AA_UseSoftwareOpenGL);
      

    需要注意的是,如果禁用或更改GPU加速方式,可能会影响QWebEngineView的性能和体验。因此,建议在尝试以上解决方法之前,先备份应用程序数据,以免出现不可逆的问题。

    虽然QWebEngineView存在一些bug,但Qt框架的开发者们一直在积极地修复和改进这些问题。开发者在使用QWebEngineView时,需要注意这些问题,并尽可能避免这些问题的出现。

2、准备工作

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;

    在这里插入图片描述

posted @   mahuifa  阅读(0)  评论(0编辑  收藏  举报  
点击右上角即可分享
微信分享提示