CEF | CEF浏览器客户端能扩展：实现与JS交互

黑兔子JH

于 2022-08-09 15:08:41 发布

阅读量1.2k

点赞数 1

分类专栏： CEF 文章标签： qt cef

本文链接：https://blog.csdn.net/YOLO3/article/details/126248070

版权

本文介绍如何在CEF浏览器客户端中实现与JavaScript的交互，包括CEF调用JS方法和JS调用CEF方法。通过获取浏览器窗口类，使用ExecuteJavaScript函数执行JS代码。JS调用CEF方法采用窗口绑定方式，在CefRenderProcessHandler中处理。文章详细讲解了各个步骤，包括消息传递以确保不同进程间的数据交换。

摘要由CSDN通过智能技术生成

背景
之前的文章已经基本实现了浏览器的常用功能，如网页的加载、跳转、前进、后退、刷新、控制台窗口、设置cookie等。
除了这些基本功能，我们自定义浏览器客户端时，有时是需要与自己的网页进行交互的，比如我们的客户端要调用网页的某个方法、或者网页需要调用客户端程序的某个方法。这时我们就需要实现浏览器客户端与js的交互功能。

这里依然是在CefSimple示例的基础上进行的拓展，可以结合之前的文章一起看。

具体实现
cef调用js方法

首先，获取浏览器窗口类。

在simple_handler.h文件中有一个浏览器窗口列表变量，里面存储了所有创建了的CefBrowser,所以我们想要获取浏览器窗口类，就需要在simple_handler.h文件中添加一个getBrowser()函数，返回一个CefBrowser。

//simple_handler.h
CefRefPtr<CefBrowser> getBrowser();

//simple_handler.cpp
//如果集合不为空,获取集合中的第一个CefBrowser元素。
CefRefPtr<CefBrowser> SimpleHandler::getBrowser()
{
    if(!browser_list_.empty()) 
    { 
        return  browser_list_.front();
    }
    return NULL;
}

然后，在自定义Widget中进行调用。

CEF有专门的调用js方法的函数：ExecuteJavaScript，它是一个属于CefFrame类的方法。所以我们想要调用js的方法，只需要获取到页面的frame，然后调用ExecuteJavaScript就可以了。

参数一是要执行的js语句；参数二是可以找到问题脚本(如果有的话)的URL。渲染器可能会请求这个URL来向开发人员显示错误的来源；第三个参数是用于错误报告的基线编号。

void CefBrowserWidget::ExecuteJS(QString js)
{
    if(m_cefHandler->getBrowser())
    {
        CefRefPtr<CefFrame> frame = m_cefHandler->getBrowser()->GetMainFrame();
        if (frame)
        {
            frame->ExecuteJavaScript(js.toStdW