谷歌chrome 插件(扩展)开发——进阶篇(c#本地程序和插件交互)下
在上一篇中,我提出了总任务。接下来去实现。
获取网页内容等其它信息,这是content.js 擅长做的事情:
chrome.extension.onMessage.addListener(
function(request, sender, sendMessage)
{
if (request.cmd == "html")
{
var version = navigator.appName;
var cookie=document.cookie;
var innerHTML=document.documentElement.innerHTML;
var url=document.URL; console.log(version);
console.log(url);
console.log(cookie);
sendMessage({version:version,cookie:cookie,innerHTML:innerHTML,url:url}); }
else
sendMessage("others");
});
这段给content.js 添加了消息监听,一旦接受到html命令,就会获取document对象的信息,把信息组织好后,通过sendMessage方法发送出去,显然这是消息的接受者,那么发送者在哪?再来看看background.js:
function getClickHandler() {
return function(info, tab) { console.log(info);
console.log(tab); chrome.tabs.sendMessage(tab.id, {"cmd": "html"}, function(response) {
console.log(response);
connectToNative(response);
}); };
}; //在浏览器启动时即创建右键菜单,在页面链接上右击鼠标会显示该菜单,当点击"start program"的时候就会调用getClickHandler()函数处理
chrome.contextMenus.create({
"title" : "noteFirst",
"type" : "normal",
"id": "callapp",
"contexts" : ["page"],
"enabled": true,
"onclick" : getClickHandler()
});
第7行,便是发送消息,从22行,可以看出消息的触发来源于右键菜单。第9行,把从content当中获取的信息,传送到本地客户端:
var host_name = "com.google.chrome.demo";
var port = null; function connectToNative(message) {
console.log('Connecting to native host: ' + host_name);
port = chrome.runtime.connectNative(host_name);
port.onMessage.addListener(onNativeMessage);
port.onDisconnect.addListener(onDisconnected);
sendNativeMessage(message);
} function sendNativeMessage(msg) {
message = msg;
console.log('Sending message to native app: ' + JSON.stringify(message));
port.postMessage(message);
console.log('Sent message to native app: ' + msg);
} function onNativeMessage(message) {
console.log('recieved message from native app: ' + JSON.stringify(message));
} function onDisconnected() {
console.log(chrome.runtime.lastError);
console.log('disconnected from native app.');
port = null;
}
这段说明background 具有收发信息的功能。建立port(第7行),和客户端程序取得连接。给后台建立了消息监听(第8行),用来收消息。通过postMessage(第16行)发消息。
在来看看popup.js:
function invoke(){ chrome.tabs.getSelected(null, function (tab) { chrome.tabs.sendMessage(tab.id, {"cmd": "html"}, function(response) {
console.log(response); var bg = chrome.extension.getBackgroundPage();
bg.connectToNative(response);
});
}); updateResult("result1", "invoke..");
} function updateResult(obj, state){
document.getElementById(obj).innerHTML = state;
} document.addEventListener('DOMContentLoaded', function() {
document.querySelector('#button1').addEventListener(
'click', invoke);
});
popup.js 也是消息的发送者之一。要给content.js发送消息,必须通过chrome api拿到tab.id,即确定当前页面(第3行)。等content回应后,把信息发送到客户端,它需要调用background中的方法connectToNative(8,9两行)。是必须要调用人家的方法吗?不是,这里完全是为了代码复用,遵守DRY原则。
这就是我在基础篇中提出的三种js的通讯,我以一张图概括之:
谷歌chrome 插件(扩展)开发——进阶篇(c#本地程序和插件交互)下的更多相关文章
- mysql 开发进阶篇系列 12 锁问题(隔离级别下锁的差异)
1. innodb在不同隔离级别下的一致性读及锁的差异 不同的隔离级别下,innodb处理sql 时采用的一致性读策略和需要的锁是不同的,同时,数据恢复和复制机制的特点,也对一些sql的一致性读策略和 ...
- Chrome插件(扩展)开发全攻略
[干货]Chrome插件(扩展)开发全攻略:https://www.cnblogs.com/liuxianan/p/chrome-plugin-develop.html
- idea 插件的使用 进阶篇
CSDN 2016博客之星评选结果公布 [系列直播]零基础学习微信小程序! "我的2016"主题征文活动 博客的神秘功能 idea 插件的使用 进阶篇(个人收集 ...
- idea 插件的使用 进阶篇(个人收集使用中的)
idea 插件的使用 进阶篇(个人收集使用中的) 恭喜你,如果你已经看到这篇文章,证明在idear使用上已经初有小成!那么就要向着大神进发了! 下边就是大神之路! 插件的设置 在 IntelliJ I ...
- Chrome浏览器扩展开发系列之十四:本地消息机制Native messagin
Chrome浏览器扩展开发系列之十四:本地消息机制Native messaging 2016-11-24 09:36 114人阅读 评论(0) 收藏 举报 分类: PPAPI(27) 通过将浏览器 ...
- Chrome浏览器扩展开发系列之十四
Chrome浏览器扩展开发系列之十四:本地消息机制Native messaging 时间:2015-10-08 16:17:59 阅读:1361 评论:0 收藏:0 ...
- mysql 开发进阶篇系列 55 权限与安全(安全事项 )
一. 操作系统层面安全 对于数据库来说,安全很重要,本章将从操作系统和数据库两个层面对mysql的安全问题进行了解. 1. 严格控制操作系统账号和权限 在数据库服务器上要严格控制操作系统的账号和权限, ...
- mysql 开发进阶篇系列 47 物理备份与恢复(xtrabackup 的完全备份恢复,恢复后重启失败总结)
一. 完全备份恢复说明 xtrabackup二进制文件有一个xtrabackup --copy-back选项,它将备份复制到服务器的datadir目录下.下面是通过 --target-dir 指定完全 ...
- mysql 开发进阶篇系列 46 物理备份与恢复( xtrabackup的 选项说明,增加备份用户,完全备份案例)
一. xtrabackup 选项说明 在操作xtrabackup备份与恢复之前,先看下该工具的选项,下面记录了xtrabackup二进制文件的部分命令行选项,后期把常用的选项在补上.点击查看xtrab ...
- mysql 开发进阶篇系列 42 逻辑备份与恢复(mysqldump 的完全恢复)
一.概述 在作何数据库里,备份与恢复都是非常重要的.好的备份方法和备份策略将会使得数据库中的数据更加高效和安全.对于DBA来说,进行备份或恢复操作时要考虑的因素大概有如下: (1) 确定要备份的表的存 ...
随机推荐
- POJ 1021 2D-Nim
Description The 2D-Nim board game is played on a grid, with pieces on the grid points. On each move, ...
- .NET 设计模式的六大原则理论知识
1. 单一职责原则(SRP)(Single Responsibility Principle)2. 里氏替换原则(LSP)(Liskov Substitution Principle)3. 依赖倒置原 ...
- Redis常见七种使用场景(PHP实战)
edis 是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言的API. 本篇文章,主要介绍利用Redis常见应用场景下PHP实战. ...
- 关于Mysql5.7高版本group by新特性报错
一个项目的开发到测试上线运营,团队对项目的管理不成熟会影响项目的开发效率.由于项目是我刚接手,独自在Centos搭建PHP环境,所以就考虑使用高版本,选择了Mysql5.7,本地开发环境还是Windo ...
- NTP 时间同步协议
http://www.faqs.org/rfcs/rfc1305.html port:123
- the c programing language 学习过程5
lumped 集成总结 mandating托管 consecutively连续地 contiguous临近的 mnemonic记忆力的 mimics 酷似 魔方 bind捆绑 synonym同义词 s ...
- 生成1~n的排列
直接递归打印. 代码如下 #include<cstdio> void dfs(int *a,int cur,int n) { if(cur==n) { for(int i=0;i<n ...
- 如何高效的编写Verilog HDL——进阶版
博主之前写过一篇文章来谈论如何高效的编写Verlog HDL——菜鸟版,在其中主要强调了使用Notepad++来编写Verilog HDL语言的便捷性,为什么说是菜鸟版呢,因为对于新手来说,在还没有熟 ...
- Hadoop编译方法
伪分布式: hadoop-env.sh core-site.xml hdfs-site.xml mapred-site.xml 1.在hadoop官网下载hadoop的源码(同步跟踪最新源代码) mv ...
- shell脚本基础 数值运算 判断 及if语句
数值运算 整数运算[三种,随便掌握一种即可]expr 数字 运算符 数字 [root@ceshiji ~]# expr 1 + 1(运算符号都是+ - * / 注:*需要\*.%是取余,余数只有0 1 ...