官方主页: 点击打开链接
CEF简介:
嵌入式Chromium框架(简称CEF) 是一个由Marshall Greenblatt在2008建立的开源项目,它主要目的是开发一个基于Google Chromium的Webbrowser控件。CEF支持一系列的编程语言和操作系统,并且能很容易地整合到新的或已有的工程中去。
它的设计思想政治就是易用且兼顾性能。CEF基本的框架包含C/C++程序接口,通过本地库的接口来实现,而这个库则会隔离宿主程序和Chromium&Webkit的操作细节。它在浏览器控件和宿主程序之间提供紧密的整合,它支持用户插件,协议,javascript对象以及javascript扩展,宿主程序可以随意地控件资源下载,导航,下下文内容和打印等,并且可以跟Google Chrome浏览器一起,支持高性能和Html5 技术,
CEF指南:
指南:
首先把这段代码插入到窗口的创建函数里面去:
- // Create an instance of our CefClient implementation. Various methods in the
- // MyClient instance will be called to notify about and customize browser
- // behavior.
- CefRefPtr<CefClient> client(new MyClient());
- // Information about the parent window, client rectangle, etc.
- CefWindowInfo info;
- info.SetAsChild(...);
- // Browser initialization settings.
- CefBrowserSettings settings;
- // Create the new browser window object asynchronously. This eventually results
- // in a call to CefLifeSpanHandler::OnAfterCreated().
- CefBrowser::CreateBrowser(info, client, "http://www.google.com", settings);
这段代码你可以在[test]文件夹下面的cefclient工程里面看到。
文件结构:
include -- 这个文件夹里面放CEF客户应用程序所需的头文件
libcef -- 此文件夹存放CEF的静态库
libcef_dll -- 此文件夹CEF的动态拉链库
tests -- 此文件夹存放测试的例子
cefclient -- 一个简单的客户程序
unittests -- CEF界面单元测试
浏览器事件:
插入网景风格插件:
JavaScript扩展:
用户计划:
框架总览:
框架的建立和销毁:
引用计数:
平台无关:
框架接口:
以上内容是Cef的简介,后面我将翻译怎么编译并生成一个用CEF控件来创建的一个简单浏览器!
这部分讲解CEF的分支信息并介绍下载编译和打包源代码
背景:
发展:
发布版:
发布版本 | Chromium版本 | CEF1支持性 | CEF3支持性 |
963 | 17 | 是 | 否 |
1025 | 18 | 是 | 否 |
1084 | 19 | 是 | 否 |
1180 | 21 | 是 | 是 |
1271 | 23 | 是 | 是 |
1364 | 25 | 是 | 是 |
1453 | 26 | 是 | 是 |
编译源代码:
1.为你的操作系统和开发环境安装必要的包:
2.配置环境可以影响GYP
自动的方法:
1.下载自动工具 automate.py:
<span class="pln">http</span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="com" style="color: rgb(136, 0, 0);">//chromiumembedded.googlecode.com/svn/trunk/cef1/tools/automate /path/to/automate</span>
2.运行automate.py脚本:
<span class="pln">python </span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">path</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">automate</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">automate</span><span class="pun" style="color: rgb(102, 102, 0);">.</span><span class="pln">py </span><span class="pun" style="color: rgb(102, 102, 0);">--</span><span class="pln">download</span><span class="pun" style="color: rgb(102, 102, 0);">-</span><span class="pln">dir</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="str" style="color: rgb(0, 136, 0);">/path/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">download </span><span class="pun" style="color: rgb(102, 102, 0);">--</span><span class="pln">url</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln">http</span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="com" style="color: rgb(136, 0, 0);">//chromiumembedded.googlecode.com/svn/branches/1084/cef1</span>
手动下载:
开发版:
<span class="pln"> svn co http</span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="com" style="color: rgb(136, 0, 0);">//src.chromium.org/svn/trunk/tools/depot_tools</span>C. 增加 depot_tools的目录到你的PATH,在Windows下depot_tools的路径应该要放在TortoiseSVN的前面
<span class="pln">cd </span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">path</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">chromium gclient config http</span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="com" style="color: rgb(136, 0, 0);">//src.chromium.org/chrome/trunk/src</span>remind: 上面这段你只要复制到cmd里面去运行就可以了
<span class="pln">cd </span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">path</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">chromium gclient sync </span><span class="pun" style="color: rgb(102, 102, 0);">--</span><span class="pln">revision src@chromium_revision </span><span class="pun" style="color: rgb(102, 102, 0);">--</span><span class="pln">jobs </span><span class="lit" style="color: rgb(0, 102, 102);">8</span><span class="pln"> </span><span class="pun" style="color: rgb(102, 102, 0);">--</span><span class="pln">force</span>4. 下载CEF源代码到"cef"文件夹,而且这个文件夹必须包含在Chromium的"src"文件夹目录下,你最好只下载CEF1或CEF3而不要两者都下,假设你的Chromium源代码下载在 "/path/to/chromium/src",那么你的CEF源代码就应该放在"/path/to/chromium/src/cef"。注意不管你下的是CEF1或CEF3,文件夹名都必须命名为"cef"
<span class="pln">cd </span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">path</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">chromium</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">src svn co http</span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="com" style="color: rgb(136, 0, 0);">//chromiumembedded.googlecode.com/svn/trunk/cef1 cef</span>
发布版:
手动编译:
1.运行cef_create_project脚本(windows下用.bat, OS-X和linux下用.sh)去产生一个在GYP配置下的编译文件
<span class="pln">cd </span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">path</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">chromium</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">src</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">cef </span><span class="pun" style="color: rgb(102, 102, 0);">./</span><span class="pln">cef_create_projects</span><span class="pun" style="color: rgb(102, 102, 0);">.</span><span class="pln">sh</span>
2.编译CEF
<span class="pln">cd </span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">path</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">chromium</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">src</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">cef</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">tools build_projects</span><span class="pun" style="color: rgb(102, 102, 0);">.</span><span class="pln">sh </span><span class="typ" style="color: rgb(102, 0, 102);">Debug</span>
手动打包:
<span class="pln">cd </span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">path</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">to</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">chromium</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">src</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">cef</span><span class="pun" style="color: rgb(102, 102, 0);">/</span><span class="pln">tools make_distrib</span><span class="pun" style="color: rgb(102, 102, 0);">.</span><span class="pln">sh</span>如果这个过程成功了,一个二进制的分发包会生成在 /path/to/chromium/src/cef/binary_distrib目录中。
一般用法
使用CEF便捷的创建一个全功能的内建浏览器如下所示:
// Define an instance of our CefHandler implementation. Various methods in the MyHandler // instance will be called to customize browser behavior. CefRefPtr<CefHandler> handler(new MyHandler()); // Provide information about the parent window, client rectangle, etc. CefWindowInfo info = {...}; // Create the new browser window object, which eventually results in a call to // MyHandler::HandleAfterCreated(). CefBrowser::CreateBrowser(info, false, handler, L"http://www.google.com");
在tests目录下有一个客户端程序的示例,叫cefclient。
文件结构
CEF资料库结构如下:
- include -- 包括用于CEF客户端程序的include文件。
- libcef -- libcef实现。
- libcef_dll -- libcef C API 和 DLL 实现.
- tests -- 测试程序.
- cefclient -- CEF客户端应用程序示例。
- unittests -- CEF接口单元测试。
浏览器通知
浏览器通知是通过注册的委托接口由浏览器发到客户端程序的通知, CefHandler是最主要的委托接口, CefJSHandler则用于实现自定义的Javascript对象。
CefHandler支持以下接口:
- 窗口创建之前 (HandleBeforeCreated),客户端可用之取消与定制浏览器窗口创建过程。
- 窗口创建之后(HandleAfterCreated). 可用于创建自定义的CefJSHandler对象。
- 地址栏更新(HandleAddressChange). 将地址栏更改为指定的字符串,通知发生于导航提交后与页面加载前。
- 标题更新(HandleTitleChange). 将标题更改为指定的字符串,发生在页面加载中。
- 浏览前(HandleBeforeBrowse). 可用于取消导航,该事件的信息包括URL,Post数据,请求头.
- 开始加载(HandleLoadStart).
- 加载结束 (HandleLoadEnd).
- 加载错误(HandleLoadError). 加载过程中遇到错误,应用程序可提供自定义的错误页面.
- 资源加载前 (HandleBeforeResourceLoad). 应用程序可提供替代的数据源 (比如内存中的缓存)或者取消加载.
- 显示菜单前(HandleBeforeMenu). 可用于取消上下文菜单显示或定制菜单,默认情况下,浏览器根据上下文显示基本的菜单.
- 获取菜单标签(HandleGetMenuLabel).在默认菜单显示前,每个菜单项调用一次,可用于将英文默认内容改为其它语言.
- 菜单动作(HandleMenuAction). 用户从默认上下文菜单选择了一个选项,可用自己的方式来处理动作。
- 打印选项(HandlePrintOptions). 打印设置对话框显示前调用,可用于定制页面大小、方向与边距等.
- 打印页眉页脚 (HandlePrintHeaderFooter). 在页面视图输出到打印上下文,但是页面结束前,可在预定义的6个位置(上左、上中、上右、下左,下中,下右)插入自定义的页眉、页脚字符串。该事件附带的信息包括当前URL、标题、页码、总页数、打印上下文、页边距与DPI拉伸比.
- JavaScript警告 (HandleJSAlert). 应用程序可自定义Javascript Alert窗口.
- JavaScrip确认 (HandleJSConfirm). 应用程序可自定义Javascript Comfirm窗口
- JavaScrip提示 (HandleJSPrompt). 应用程序可自定义Javascript Prompt窗口
- JavaScript Window 对象绑定 (HandleJSBinding). 应用程序将用户定义的方法和变量附加到frame的window对象上
- Window关闭前 (HandleBeforeWindowClose). 窗口关闭前
- 获得焦点(HandleTakeFocus). 浏览器组件失去焦点前调用
- 设置焦点(HandleSetFocus). 浏览器组件请求焦点前调用
- 键盘事件(HandleKeyEvent). 浏览器组件接收到键盘事件时
- 提示 (HandleTooltip). 用于修改tooltip文字
- 控制台消息 (HandleConsoleMessage). 用于显示控制台消息.
- 查询结果(HandleFindResult).用于自定义查找结果显示处理
CefV8Handler支持以下通知:
- 执行事件(Execute). 应用程序执行指定的函数,该事件提供所有的Javascript参数,而且应用程序能指定返回值
浏览器事件
浏览器事件由客户端应用程序通过CefBrowser和CefFrame的函数发送给浏览器:
- 后退、前进、重新加载与停止加载,用于控制浏览器导航.
- 撤消、重做、剪切、复制、粘贴、删除、全选,用于控制目标区域内容.
- 打印. 打印目标框架.
- 查看源代码. 将目标框架的HTML源代码保存到临时文件,并用默认的文本查看程序打开之
- 加载URL. 在指定框架中加载指定URL
- 载入字符串. 根据一个假URL在指定框架中加载某个字符串
- 加载流. 根据一个假URL,在指定框架中加载二进制数据
- 加载请求. 在指定框架中加载请求(URL, method, request data 与 headers) .
- 执行脚本. 在目标框架中执行任意Javascript命令
内嵌 NPAPI 插件
CEF支持创建Netscape-style内嵌插件,使用相同 NPAPI的内嵌插件和标准的DLL插件行为相同,但是,相对于使用独立的DLL,内嵌插件由容器应用程序创建,并通过调用CefRegisterPlugin()注册到系统,如果要直接使用这一功能,需要include cef_nplugin.h .
JavaScript扩展
CEF支持可以和原生应用程序代码交互的Javascript扩展,参见cef.h的CefRegisterExtension() 函数和cefclient示例程序的"JavaScript Extension Handler" 以及 "UI App Example" 测试 .
自定义Schemes
CEF支持注册与处理自定义scheme,类似于myscheme://mydomain。参见cef.h中的CefRegisterScheme()函数与示例应用程序cefclient中的 "Scheme Handler" 测试.
框架实现概览
CEF所有的类以Cef为前缀.
框架准备与拆卸
UI消息循环由框架创建的一个单独线程处理,客户端程序应负责通过分别调用CefInitialize()和CefShutdown() 来为每个进程准备与关闭这一线程。
引用计数
所有实现了CefBase接口的框架类与对象指针都由CefRefPtr智能指针实现来处理,通过调用AddRef()和Release()自动处理引用计数。
平台无关
CEF框架被设计成平台无关,需要当前我们仅支持windows平台,但是我们计划将来支持其它平台。为了尽可能减少双平台支持带来的麻烦,框架定义了一系列实现无关的接口与类型定义包装跨平台的行为。
线程安全
框架的所有接口实现必须是跨线程访问安全的,CefThreadSafeBase 模版提供原子的AddRef() 和 Release() 实现,还提供Lock() 和 Unlock()方法以同步方式访问代码块.
框架接口
框架定义了如下接口:
- CefBrowser 是主要的浏览器host类,通过它的静态方法CefBrowser::CreateBrowser()方法创建新浏览器窗口.
- CefFrame 表示浏览器窗口里的一个框架(frame),每个浏览器窗口都有一个顶级的主框架,可通过CefBrowser::GetMainFrame()方法访问之.
- CefHandler 是传给CefBrowser::CreateBrowser()方法的最主要委托接口.
- CefRequest 表示请求数据,比如url, method, post data 和 headers.
- CefPostData 和 CefPostDataElement 表示可能是请求一部分的post数据.
- CefSchemeHandlerFactory 和 CefSchemeHandler 用于处理像myscheme://mydomain这样的自定义scheme.
- CefStreamReader, CefStreamWriter, CefReadHandler 和 CefWriteHandler 读写数据的简单的接口.
- CefV8Handler 和 CefV8Value 用于创建和访问Javascript对象.