以查询历史记录为例:

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. spring通过静态方法获得properties文件的值

    获得spring bean方法 @Component public class BeanUtils implements ApplicationContextAware { private stati ...

  2. Xcode 7如何 免费 真机调试iOS应用

    运行Xcode后,点击菜单中的Preferences…进入Accounts标签,这里选择添加Apple ID: 在弹出的对话框中登入你的Apple ID,没有的话去注册一个就是了,登录成功后会看到下面 ...

  3. Total Commander 8.52 Beta 1

    Total Commander 8.52 Beta 1http://www.ghisler.com/852_b1.php 10.08.15 Release Total Commander 8.52 b ...

  4. Qt中sizeof

    class a{ int d; // virtual void ssss(); }; qDebug() <<sizeof(a) << sizeof(int) << ...

  5. PHP面试题之驼峰字符串转换成下划线样式例子

    自己在看到这个问题的时候,想到的是用ASCII码来处理,没往万能的正则上去想.好吧,下面来看看答案: 答案1: 代码如下 复制代码 $str = 'OpenAPI'; $length = mb_str ...

  6. sql的列的说明

    <#@ template debug="true" hostspecific="true" language="C#" #> & ...

  7. 关于spring中无法将service注入到servlet中的问题

    首先,servlet是动态网页项目区别于普通的java项目的,是动态网页项目中web.xml主要配置文件管理的,而spring只能管理普通的pojo,而没办法直接注入,尽管你的注入方式和配置方式都没有 ...

  8. Vue.js的计算属性

    开始用vue会把所有的模版上的数据都放到data属性里,或者有的时候data属性里变量多了之后觉得有些只是用一次的变量就直接写到模版里了,后来看到同组的同事在用computed属性,就又去查了一下ap ...

  9. 位置指纹(LF)定位技术简介-室内定位

        信号的多径传播对环境具有依赖性,呈现出非常强的特殊性.对于每个位置而言,该位置上信道的多径结构是惟一的,终端发射的无线电渡经过反射和折射,产生与周围环境密切相关的特定模式的多径信号,这样的多径 ...

  10. setTimeout用于取消多次执行mouseover或者mouseenter事件,间接实现hover的悬停加载的效果.

    Mouseenter在鼠标滑上去不会对其子元素也发生监听, Mouseover在鼠标滑上去会对其子元素发生监听. 所以对于事件的监听,我们要看需求,这里是对父元素的监听,不需要对子元素做监听.就用mo ...