CEF 实战：打造高性能 Mac 混合应用

原创于 2025-09-25 07:22:40 发布 · 1k 阅读

14 ·

CC 4.0 BY-SA版权

文章标签：

#macos

CEF实战：打造高性能Mac混合应用

在这里插入图片描述

引言：混合应用开发的利器

在当今应用开发领域，纯原生或纯Web的开发模式正逐渐被混合应用所取代。Chromium Embedded Framework (CEF) 作为连接原生与Web世界的桥梁，为开发者提供了将强大的Web引擎嵌入到原生应用中的能力。

本文将深入探讨如何在macOS平台上利用CEF构建高性能的混合桌面应用，从基础概念到实际开发，全方位覆盖CEF应用开发的各个方面。

CEF基础：不止于嵌入式浏览器

CEF是什么？

CEF是一个开源框架，它允许开发者将完整的Chromium浏览器引擎嵌入到自己的应用中。这意味着你可以在原生应用中享受到：

完整的HTML5/CSS3/JavaScript支持
现代浏览器的性能和安全特性
丰富的扩展能力

CEF的核心优势

跨平台能力：一套代码可运行于Windows、macOS和Linux
多语言支持：不仅支持C/C++，还提供C#、Python等语言绑定
稳定可靠：拥有完善的API和长期支持
高度可定制：从简单的浏览器控件到复杂的Web交互都能实现

架构设计：CEF的多进程模型

CEF采用了与Chrome浏览器相似的多进程架构，这是理解其工作原理的关键。

主要进程

主进程 (Browser Process)
- 应用程序的入口点
- 负责窗口管理和资源调配
- 协调其他进程的工作
渲染进程 (Render Process)
- 负责网页内容的渲染
- 执行JavaScript代码
- 处理DOM操作

核心组件

CefApp：应用级接口，管理全局状态
CefClient：浏览器功能的核心接口
CefBrowser：代表一个浏览器实例

macOS开发环境搭建

系统要求

macOS 12.0+
Xcode 13.5+
CMake 3.21+

依赖安装

# 使用Homebrew安装基础工具
brew install cmake ninja

# 安装Xcode命令行工具
xcode-select --install

项目结构

一个典型的CEF项目结构如下：

MyCEFApp/
├── CMakeLists.txt
├── src/
│   ├── main.cpp
│   ├── app.h/app.cpp
│   └── handler.h/handler.cpp
├── resources/
│   └── html/
└── cmake/
    └── FindCEF.cmake

核心API实战

应用初始化

int main(int argc, char* argv[]) {
    // 加载CEF库
    CefScopedLibraryLoader library_loader;
    if (!library_loader.LoadInMain()) {
        return 1;
    }
    
    // 配置CEF
    CefMainArgs main_args(argc, argv);
    CefSettings settings;
    settings.no_sandbox = true;  // 开发环境禁用沙箱
    
    // 创建应用实例
    CefRefPtr<SimpleApp> app(new SimpleApp);
    
    // 初始化并运行
    if (!CefInitialize(main_args, settings, app.get(), nullptr)) {
        return CefGetExitCode();
    }
    
    CefRunMessageLoop();
    CefShutdown();
    return 0;
}

创建浏览器窗口

void SimpleApp::OnContextInitialized() {
    CefWindowInfo window_info;
    CefBrowserSettings browser_settings;
    
    // 设置窗口位置和大小
    CefRect rect(0, 0, 1024, 768);
    window_info.SetAsChild(parent_window_handle, rect);
    
    // 创建浏览器实例
    CefBrowserHost::CreateBrowserSync(
        window_info,
        SimpleHandler::GetInstance(),
        "https://www.example.com",
        browser_settings,
        nullptr,
        nullptr
    );
}

事件处理

// 生命周期事件处理
class SimpleHandler : public CefClient, public CefLifeSpanHandler {
public:
    // 浏览器创建完成
    void OnAfterCreated(CefRefPtr<CefBrowser> browser) override {
        browser_list_.push_back(browser);
    }
    
    // 浏览器关闭前
    bool DoClose(CefRefPtr<CefBrowser> browser) override {
        return false;  // 允许关闭
    }
    
    // 浏览器关闭后
    void OnBeforeClose(CefRefPtr<CefBrowser> browser) override {
        browser_list_.remove(browser);
        if (browser_list_.empty()) {
            CefQuitMessageLoop();  // 所有窗口关闭后退出
        }
    }
    
private:
    std::list<CefRefPtr<CefBrowser>> browser_list_;
    IMPLEMENT_REFCOUNTING(SimpleHandler);
};

JavaScript与原生代码交互

从C++调用JavaScript

// 执行简单的JS代码
browser->GetMainFrame()->ExecuteJavaScript(
    "console.log('Hello from C++!');",
    browser->GetMainFrame()->GetURL(),
    0
);

向JavaScript暴露原生接口

class JSExtension : public CefV8Handler {
public:
    bool Execute(const CefString& name,
                CefRefPtr<CefV8Value> object,
                const CefV8ValueList& arguments,
                CefRefPtr<CefV8Value>& retval,
                CefString& exception) override {
                
        if (name == "showMessage" && arguments.size() == 1 && arguments[0]->IsString()) {
            std::string message = arguments[0]->GetStringValue();
            std::cout << "JavaScript called: " << message << std::endl;
            
            // 返回结果给JavaScript
            retval = CefV8Value::CreateString("Message received");
            return true;
        }
        
        return false;
    }
    
private:
    IMPLEMENT_REFCOUNTING(JSExtension);
};

macOS平台特定实现

AppDelegate实现

// AppDelegate.h
#import <Cocoa/Cocoa.h>
#include "include/cef_browser.h"
#include "include/cef_client.h"

class SimpleHandler : public CefClient, public CefLifeSpanHandler {
public:
    CefRefPtr<CefLifeSpanHandler> GetLifeSpanHandler() override {
        return this;
    }
    
    void OnAfterCreated(CefRefPtr<CefBrowser> browser) override {
        // 保存浏览器实例
    }
    
    IMPLEMENT_REFCOUNTING(SimpleHandler);
};

@interface AppDelegate : NSObject <NSApplicationDelegate>
@property (strong) NSWindow *window;
@end

// AppDelegate.mm
@implementation AppDelegate {
    CefRefPtr<CefBrowser> browser_;
    CefRefPtr<SimpleHandler> handler_;
}

- (void)applicationDidFinishLaunching:(NSNotification *)aNotification {
    // 创建窗口
    NSRect frame = NSMakeRect(100, 100, 1024, 768);
    self.window = [[NSWindow alloc] initWithContentRect:frame
                                              styleMask:(NSWindowStyleMaskTitled |
                                                         NSWindowStyleMaskClosable |
                                                         NSWindowStyleMaskResizable)
                                                backing:NSBackingStoreBuffered
                                                  defer:NO];
    [self.window setTitle:@"CEF Demo"];
    [self.window makeKeyAndOrderFront:nil];
    
    // 延迟创建浏览器
    dispatch_async(dispatch_get_main_queue(), ^{
        NSView *contentView = [self.window contentView];
        
        CefWindowInfo window_info;
        CefBrowserSettings browser_settings;
        
        CefRect rect(0, 0,
                   (int)contentView.bounds.size.width,
                   (int)contentView.bounds.size.height);
        window_info.SetAsChild((__bridge CefWindowHandle)contentView, rect);
        
        self->handler_ = new SimpleHandler();
        
        self->browser_ = CefBrowserHost::CreateBrowserSync(
            window_info,
            self->handler_,
            "https://www.apple.com.cn",
            browser_settings,
            nullptr,
            nullptr
        );
    });
    
    // 监听窗口大小变化
    [[NSNotificationCenter defaultCenter] addObserver:self
                                             selector:@selector(windowDidResizeNotification:)
                                                 name:NSWindowDidResizeNotification
                                               object:self.window];
}

- (void)windowDidResizeNotification:(NSNotification *)notification {
    if (browser_) {
        browser_->GetHost()->WasResized();
    }
}

@end

高级功能实现

自定义协议处理

class CustomSchemeHandler : public CefResourceHandler {
public:
    bool ProcessRequest(CefRefPtr<CefRequest> request,
                       CefRefPtr<CefCallback> callback) override {
                       
        std::string url = request->GetURL().ToString();
        
        if (url.find("custom://") == 0) {
            // 生成自定义内容
            content_ = "<html><body><h1>Custom Protocol</h1></body></html>";
            mime_type_ = "text/html";
            status_code_ = 200;
            status_text_ = "OK";
            
            callback->Continue();
            return true;
        }
        
        return false;
    }
    
    // 其他必要方法...
    
private:
    std::string content_;
    std::string mime_type_;
    int status_code_;
    std::string status_text_;
    size_t offset_ = 0;
    
    IMPLEMENT_REFCOUNTING(CustomSchemeHandler);
};

文件下载处理

class DownloadHandler : public CefDownloadHandler {
public:
    void OnBeforeDownload(CefRefPtr<CefBrowser> browser,
                         CefRefPtr<CefDownloadItem> download_item,
                         const CefString& suggested_name,
                         CefRefPtr<CefBeforeDownloadCallback> callback) override {
                         
        std::string download_path = "/Users/username/Downloads/" + 
                                   suggested_name.ToString();
                                   
        callback->Continue(download_path, false);
    }
    
    void OnDownloadUpdated(CefRefPtr<CefBrowser> browser,
                         CefRefPtr<CefDownloadItem> download_item,
                         CefRefPtr<CefDownloadItemCallback> callback) override {
                         
        int percentage = download_item->GetPercentComplete();
        std::cout << "Download progress: " << percentage << "%" << std::endl;
        
        // 可以在这里取消下载
        if (should_cancel_download_) {
            callback->Cancel();
        }
    }
    
private:
    bool should_cancel_download_ = false;
    IMPLEMENT_REFCOUNTING(DownloadHandler);
};

构建与部署

CMake配置

cmake_minimum_required(VERSION 3.21)
project(MyCEFApp)

# 设置CEF路径
set(CEF_ROOT "/path/to/cef_binary_macosarm64")
set(CMAKE_MODULE_PATH ${CMAKE_MODULE_PATH} "${CEF_ROOT}/cmake")

# 查找CEF
find_package(CEF REQUIRED)

# 添加libcef_dll_wrapper
add_subdirectory(${CEF_LIBCEF_DLL_WRAPPER_PATH} libcef_dll_wrapper)

# 设置C++标准
set(CMAKE_CXX_STANDARD 17)
set(CMAKE_CXX_STANDARD_REQUIRED ON)

# 创建可执行文件
add_executable(MyCEFApp
    src/main.cpp
    src/app.cpp
    src/handler.cpp
    src/AppDelegate.mm
)

# 设置Objective-C++编译选项
set_source_files_properties(src/AppDelegate.mm PROPERTIES
    COMPILE_FLAGS "-x objective-c++")

# 链接库
target_link_libraries(MyCEFApp
    libcef_dll_wrapper
    ${CEF_STANDARD_LIBS}
    "-framework Cocoa"
    "-framework CoreFoundation"
    "-framework Security"
    "-framework SystemConfiguration"
)

# 设置包含目录
target_include_directories(MyCEFApp PRIVATE
    ${CEF_INCLUDE_DIRS}
    src/
)

构建命令

# 创建构建目录
mkdir build && cd build

# 配置项目
cmake -G "Ninja" -DCMAKE_BUILD_TYPE=Debug ..

# 编译项目
ninja MyCEFApp

macOS应用打包

一个标准的macOS应用包结构：

MyCEFApp.app/
├── Contents/
│   ├── Info.plist
│   ├── MacOS/
│   │   └── MyCEFApp
│   ├── Frameworks/
│   │   └── Chromium Embedded Framework.framework/
│   └── Resources/
│       └── MyCEFApp Helper.app/

性能优化与最佳实践

内存管理

使用CefRefPtr进行自动引用计数管理
避免对象间的循环引用
及时释放不再需要的资源

线程安全

理解CEF的线程模型
使用CefPostTask进行跨线程通信
避免在错误的线程上执行操作

性能优化技巧

// 优化浏览器设置
void OptimizeBrowserSettings(CefBrowserSettings& settings) {
    // 禁用不需要的功能
    settings.plugins = STATE_DISABLED;
    settings.javascript_close_windows = STATE_DISABLED;
    
    // 限制帧率
    settings.windowless_frame_rate = 30;
    
    // 生产环境禁用开发者工具
    #ifndef DEBUG
    settings.devtools_open = false;
    #endif
}