Web前端项目的跨平台桌面客户端打包方案之——CEF框架

简介: Chromium Embedded Framework (CEF) 是一个基于 Google Chromium 项目的开源 Web 浏览器控件,旨在为第三方应用提供嵌入式浏览器支持。CEF 隔离了底层 Chromium 和 Blink 的复杂性,提供了稳定的产品级 API。它支持 Windows、Linux 和 Mac 平台,不仅限于 C/C++ 接口,还支持多种语言。CEF 功能强大,性能优异,广泛应用于桌面端开发,如 QQ、微信、网易云音乐等。CEF 开源且采用 BSD 授权,商业友好,装机量已超 1 亿。此外,GitHub 项目 CefDetector 可帮助检测电脑中使用 CEF

@[toc]

1、什么是CEF

CEF是什么

  • 概念
    Chromium Embedded Framework (CEF)是个基于Google Chromium项目的开源Web browser控件。
    CEF的目标是为第三方应用提供可嵌入浏览器支持。CEF隔离底层Chromium和Blink的复杂代码,并提供一套产品级稳定的API。

  • Web前端的发展方向
    1、分工:有些人去搞 React、Vue,有些人就去搞 Rollup、Webpack。
    2、溢出:有些人用前端技术搞后端(Node.js、Deno),有些人用前端技术搞桌面端(Electron、CEF),还有些人用前端技术搞人工智能(TensorFlow.js) 。

CEF的特点:

  • 跨平台, 跨语言
    CEF支持Windows, Linux, Mac平台。除了提供C/C++接口外,也有其他语言的移植版。

  • 功能多,性能强
    因为基于Chromium,所以CEF支持Webkit & Chrome中实现的HTML5的特性,并且在性能上面,也比较接近Chrome。

  • 开源可靠
    它是一个开源项目,且采用的是 BSD 授权协议,商业授权非常友好。
    所以很多大厂都选择 CEF 作为桌面端开发框架。

  • 很多人用
    据 CEF 官网数据,CEF 框架装机量超过 1 亿。
    QQ 桌面端、微信桌面端、网易云音乐桌面端、 MATLAB 、 FoxMail 、OBS Studio 等。

2、测测你电脑里的CEF

最近很火的一个Github项目:CefDetector
Mac版本参考SafariYYDS

  • 首先需要安装 完整版Everything 并完成全硬盘的扫描.
  • 然后解压后运行 CefDetector.exe,即可检测你电脑里哪些程序使用了CEF
  • 绿色文件名表示当前正在运行的CEF程序。

如题:

  • 你的电脑就是你的垃圾桶,你所热爱的
    在这里插入图片描述

3、从0开始的CEF入门实例

CEF只是一个标准,有很多相关的框架

  • 包括但不限于libcef、Electron、NWJS、CefSharp、Edge 和 Chrome
  • CEF则比较单纯,只对Chromium做了精简和封装,允许开发者通过C++代码控制Chromium核心,允许JavaScript和C++互操作。
  • 还有二次打包的,比如像访问托盘图标、访问剪切板、Socket通信、读写文件这类事情,它都没做。所以Electron为他们做了这些事情,而且做的很好。

这里我们以较为纯原生的libcef为例:

  • libcef下载:spotifycdn
    在这里插入图片描述
  • VS2022打开目录
    cmake:配置和构建以Windows作为编译环境的cmake配置文件。
    Debug和Release:已经编译好的CEF核心库文件
    include:libcef本身提供的头文件以及wrapper会使用到的头文件。
    libcef_dll:存放了libcef_dll_wrapper源码。
    Resources:CEF作为内核的浏览器运行时需要用到的资源文件。
    tests:存放了利用libcef、以及wrapper作为库来编写的浏览器Demo。其中,cefsimple编译出来的是一个简单的浏览器,而cefclient编译出来的是一个展示了cef许多API功能的exe。
    在这里插入图片描述
  • 使用cmake进行配置构建
    安装cmake-gui
    选择源码位置和cmake编译后的程序的存放位置
    在这里插入图片描述
    Configure选择配置并进行构建
    在这里插入图片描述
    最后Generate一下
    在这里插入图片描述

  • 使用VS2022编译测试用例,打开构建生成的cef.sln项目
    文件夹里面的内容如下:

    ALL_BUILD与ZERO_CHECK:cmake自动生成的辅助工程。
    cef_gtest与ceftests:都是测试模块
    cefclient:一个包含CEF各种API演示的浏览器程序Demo
    cefsimple:一个简单的CEF浏览器程序Demo
    libcef_dll_wrapper:对libcef库的C++代码封装。上述cefclient与cefsimple都会用它。
    在这里插入图片描述
    在这里插入图片描述

  • 编译运行程序:
    首先编译libcef_dll_wrapper,然后编译cefclient和cefsimple。
    右键点击生成即可
    在这里插入图片描述
    在这里插入图片描述
    然后就可以在对应的目录中找到运行程序
    在这里插入图片描述
    在这里插入图片描述

目录
相关文章
|
并行计算 前端开发 JavaScript
Web Worker:让前端飞起来的隐形引擎
在现代 Web 开发中,前端性能优化是一个至关重要的课题,尤其是对于计算密集型的应用,如图像处理、视频处理、大规模数据分析等任务。单线程的 JavaScript 引擎常常成为性能瓶颈,导致应用变得迟缓。Web Worker,作为一种强大的技术,使得前端能够在后台进行并行计算,从而实现高效的任务处理,不影响主线程的运行和用户的交互体验。
908 108
|
JavaScript 前端开发 Java
制造业ERP源码,工厂ERP管理系统,前端框架:Vue,后端框架:SpringBoot
这是一套基于SpringBoot+Vue技术栈开发的ERP企业管理系统,采用Java语言与vscode工具。系统涵盖采购/销售、出入库、生产、品质管理等功能,整合客户与供应商数据,支持在线协同和业务全流程管控。同时提供主数据管理、权限控制、工作流审批、报表自定义及打印、在线报表开发和自定义表单功能,助力企业实现高效自动化管理,并通过UniAPP实现移动端支持,满足多场景应用需求。
1351 1
|
12月前
|
存储 前端开发 安全
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
454 5
|
前端开发 Java 物联网
智慧班牌源码,采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署
智慧班牌系统是一款基于信息化与物联网技术的校园管理工具,集成电子屏显示、人脸识别及数据交互功能,实现班级信息展示、智能考勤与家校互通。系统采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署与私有化定制。核心功能涵盖信息发布、考勤管理、教务处理及数据分析,助力校园文化建设与教学优化。其综合性和可扩展性有效打破数据孤岛,提升交互体验并降低管理成本,适用于日常教学、考试管理和应急场景,为智慧校园建设提供全面解决方案。
822 70
|
JavaScript 前端开发 API
|
前端开发 JavaScript
探索现代Web应用的微前端架构
【10月更文挑战第40天】在数字时代的浪潮中,Web应用的发展日益复杂多变。微前端架构作为一种新兴的设计理念,正逐步改变着传统的单一前端开发模式。本文将深入探讨微前端的核心概念、实现原理及其在实际项目中的应用,同时通过一个简单的代码示例,揭示如何将一个庞大的前端工程拆分成小而美的模块,进而提升项目的可维护性、可扩展性和开发效率。
|
Web App开发 编解码 移动开发
零基础音视频入门:你所不知道的Web前端音视频知识
本文回顾了Web端音视频的发展历程,同时还介绍了视频的编码、帧率、比特率等概念,提到了Canvas作为视频播放的替代方案,以及FFmpeg在音视频处理中的重要作用等知识。
432 1
|
安全 前端开发 开发工具
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
937 5
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
1330 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
|
前端开发 JavaScript 搜索推荐
HTML与CSS在Web组件化中的核心作用及前端技术趋势
本文探讨了HTML与CSS在Web组件化中的核心作用及前端技术趋势。从结构定义、语义化到样式封装与布局控制,两者不仅提升了代码复用率和可维护性,还通过响应式设计、动态样式等技术增强了用户体验。面对兼容性、代码复杂度等挑战,文章提出了相应的解决策略,强调了持续创新的重要性,旨在构建高效、灵活的Web应用。
538 6

热门文章

最新文章