以查询历史记录为例:

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. 读取微博feed伪代码

    // 读取我的好友fids $db = new DB(); $mc = new Memcached(); $_uid = 1; // my uid $sql = "select * from ...

  2. 关于css样式2

    css文本 CSS 文本属性可定义文本的外观. 通过文本属性,您可以改变文本的颜色.字符间距,对齐文本,装饰文本,对文本进行缩进,等等. 缩进文本 把 Web 页面上的段落的第一行缩进,这是一种最常用 ...

  3. He faced a maximum sentence of three years.

    Police raided his home in August and found more than 100g of marijuana. He faced a maximum sentence ...

  4. java第一天学习作业及答案

    作业一 一.选择题 1.选出在java中有效的注释声明(AD)(选两项) A.//这是注释 B.*/这是注释*/ C./这是注释 D./*这是注释*/ 2.在控制台运行一个java程序,使用的命名正确 ...

  5. VS2012+EF6+MYSQL配置

    安装以下三个插件: 1. EFTools6.1.0ForVS2012.msi 2. mysql-connector-net-6.8.3.msi 3. Mysql for Visual Studio 1 ...

  6. sql语句的匹配

    like 的通配符有两种 %(百分号):代表零个.一个或者多个字符. _(下划线):代表一个数字或者字符. 1. name以"李"开头 where name like '李%' 2 ...

  7. commonjs AMD,CMD

    CommonJS CommonJs 是服务器端模块的规范,Node.js采用了这个规范. 根据CommonJS规范,一个单独的文件就是一个模块.加载模块使用require方法,该方法读取一个文件并执行 ...

  8. jdk安装及环境变量配置

    JDK是 Java 语言的软件开发工具包,主要用于移动设备.嵌入式设备上的java应用程序.JDK是整个java开发的核心,它包含了JAVA的运行环境,JAVA工具和JAVA基础的类库. jdk下载地 ...

  9. ArcGIS二次开发实践— — 遍历ToolBox中的工具!

    在AO中,打开“文件A”的基本流程是: 1.创建对应“文件A”类型的WorkspaceFactory: 2.用WorkspaceFactory创建“文件A”的Workspace,Workspace可以 ...

  10. JAVA(1)

    java开发第一步就是学习相关知识,打牢基础是关键,下面就和小编我一起从java基础学起吧,一起加油! java方向主要包括三大块: java se 桌面开发 java ee web开发 java m ...