以查询历史记录为例:

1.在上层history.js中通过chrome.send()来向底层发送事件请求和相关参数,其中'queryHistory'为信号名称,[this.searchText_, this.offset_, this.rangeInDays_, endTime, maxResults]为向底层传递的参数:

chrome.send('queryHistory',[this.searchText_, this.offset_, this.rangeInDays_, endTime, maxResults]);

2.在底层Browsing_history_handler.cc中通过RegisterMessages函数对上层发来的事件进行响应处理:

void BrowsingHistoryHandler::RegisterMessages() {
……
…… web_ui()->RegisterMessageCallback("queryHistory",
base::Bind(&BrowsingHistoryHandler::HandleQueryHistory,
base::Unretained(this))); ……
}

之后会在BrowsingHistoryHandler::HandleQueryHistory()函数中处理查询历史记录的事件响应。

3.处理完毕后,通过CallJavascriptFunction()调用上层js的方法并将需要返回的数据一并返回。

void BrowsingHistoryHandler::ReturnResultsToFrontEnd() {
……
……
web_ui()->CallJavascriptFunction(
"historyResult", results_info_value_, results_value);
……
}

4.之后上层指定的方法,即historyResult()即获得了最初指定查询的历史记录,并可继续做相关处理,以上完成一个完整的通信:

function historyResult(info, results) {
historyModel.addResults(info, results);
}

附:

拉取代码:git clone

强制恢复到某次提交的版本:git reset --hard

可参考:

http://blog.gclxry.com/chromium-webui/

chrome源码学习之:js与底层c++的通信的更多相关文章

  1. 源码学习之MyBatis的底层查询原理

    导读 本文通过MyBatis一个低版本的bug(3.4.5之前的版本)入手,分析MyBatis的一次完整的查询流程,从配置文件的解析到一个查询的完整执行过程详细解读MyBatis的一次查询流程,通过本 ...

  2. metamask源码学习-inpage.js

    The most confusing part about porting MetaMask to a new platform is the way we provide the Web3 API ...

  3. metamask源码学习-contentscript.js

    When a new site is visited, the WebExtension creates a new ContentScript in that page's context, whi ...

  4. metamask源码学习-background.js

    这个就是浏览器后台所进行操作的地方了,它就是页面也区块链进行交互的中间部分. metamask-background描述了为web扩展单例的文件app/scripts/background.js.该上 ...

  5. metamask源码学习-ui/index.js

    The UI-即上图左下角metamask-ui部分,即其图形化界面 The MetaMask UI is essentially just a website that can be configu ...

  6. Underscore.js 源码学习笔记(下)

    上接 Underscore.js 源码学习笔记(上) === 756 行开始 函数部分. var executeBound = function(sourceFunc, boundFunc, cont ...

  7. 从Chrome源码看JS Array的实现

    .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto } .crayon-line spa ...

  8. 【 js 基础 】【 源码学习 】源码设计 (持续更新)

    学习源码,除了学习对一些方法的更加聪明的代码实现,同时也要学习源码的设计,把握整体的架构.(推荐对源码有一定熟悉了之后,再看这篇文章) 目录结构:第一部分:zepto 设计分析第二部分:undersc ...

  9. Underscore.js 源码学习笔记(上)

    版本 Underscore.js 1.9.1 一共 1693 行.注释我就删了,太长了… 整体是一个 (function() {...}());  这样的东西,我们应该知道这是一个 IIFE(立即执行 ...

随机推荐

  1. python2.7安装scikit-learn遇到的问题及解决方法

    安装完matplotlib后,在运行scikit-learn相关的库的时候又遇到缺包的问题,本来以为缺什么包就装什么包,但是由于种种原因,使我走上了弯路: 第一个坑:学校校园网限制.我用scikit- ...

  2. centos6.5 redmine 安装

    安装成功redmine信息 Redmine 2.6.0.stable   Environment:   Redmine version                2.6.0.stable   Ru ...

  3. The guard was taken to hospital in a critical condition.

    The Prince George's County Fire Department said the guard was taken to hospital in a critical condit ...

  4. Percona Server 5.6.33-79.0 发布

    Percona Server 5.6.33-79.0 发布了,该版本基于 MySQL 5.6.33,包含了所有的 bug 修复,是Percona Server 5.6 系列中的正式版本.该版本主要是修 ...

  5. 关闭键盘导致tableView:didSelectRowAtIndexPath:失效解决办法

    今天公司的小兄弟问了tableView:didSelectRowAtIndexPath:不能执行的问题. 从经验看觉得可能是控制器没有成为tableView的代理所致.但代码中已经添加了代码 _tab ...

  6. Objective-C Memory Management

    Objective-C Memory Management Using Reference Counting 每一个从NSObject派生的对象都继承了对应的内存管理的行为.这些类的内部存在一个称为r ...

  7. window上利用pip安装pandas

    官网推荐的是直接使用Anoconda,它集成了pandas,可以直接使用.安装挺简单的,有windows下的安装包.如果不想安装庞大的Anoconda,那就一步一步用pip来安装pandas.下面我主 ...

  8. 《C++primer》v5 第6章 函数 读书笔记 习题答案

    6.1 实参是在函数调用处填写的参数.形参是在函数体使用的参数. 实参是形参的初始值. 具体参见:http://blog.163.com/zhengguo_li/blog/static/7030148 ...

  9. 更新UI界面的四种方法

    一.runOnUiThread(new Runnable()): 二.Handler的sendMessage()系列: 三.Handler的post(): 四.View的post():

  10. 关于w3school的html5部分output 元素实例代码(点亲自试一试进去)的问题纠正

    修复: 将原来的 =  号修改成 <input type="button" onclick="resCalc()" value ="=" ...