最近遇到一个新的问题。需要使用Chrome 插件, 从我们对我们当地的一个网站之一启动C#应用，同时通过本申请值执行不同的操作。

在这里记录下解决的过程。以便以后查找

首先我们须要新建一个google的插件 这个插件包括了三个文件

manifest.json(名字不可改, 建插件必须文件),background.js(文件名称可改, 后台文件),content.js(content script文件 负责与站点页面交互)

首先我们来看看manifest.json 这个文件

<span style="font-family:SimSun;font-size:18px;">{

	"name" : "FastRun",

	"version" : "1.0.1",

	"description" : "Launch APP ",

	"background" : { "scripts": ["background.js"] },

	"permissions" : [

		"nativeMessaging",

		"tabs",

		"http://xxx/*"

	],

	"content_scripts": [

    {

      "matches": ["http://xxx/*"],

      "js": ["content.js"]

    }

	],

	"minimum_chrome_version" : "6.0.0.0",

	"manifest_version": 2

}</span>

里面的premissions很重要, 他表示我们的插件在什么条件执行, "nativeMessaging" 代表要在这个插件中同意调用这样的方法

"xxx"填入你想要的加载的网址

"content_scripts" 中"xxx" 表示在什么网页下执行我们与界面交互的script.

再来看看后台文件

background.js

var port = null;

chrome.runtime.onMessage.addListener(

  function(request, sender, sendResponse) {

     if (request.type == "launch"){

       	connectToNativeHost(request.message);

    }

	return true;

});

//onNativeDisconnect

function onDisconnected()

{

	console.log(chrome.runtime.lastError);

	console.log('disconnected from native app.');

	port = null;

}

function onNativeMessage(message) {

	console.log('recieved message from native app: ' + JSON.stringify(message));

}

//connect to native host and get the communicatetion port

function connectToNativeHost(msg)

{

	var nativeHostName = "com.my_company.my_application";

	console.log(nativeHostName);

 	port = chrome.runtime.connectNative(nativeHostName);

	port.onMessage.addListener(onNativeMessage);

	port.onDisconnect.addListener(onDisconnected);

	port.postMessage({message: msg});

 }

在这个文件中有两个方法很重要

chrome.runtime.onMessage.addListener

和

connectToNativeHost

先来看第一个方法。

是一个响应事件。当接收到类型为"launch"的消息时, 调用 connectToNativeHost方法并传入数据。

com.my_company.my_application

这个是我们之后须要注冊在Regestry和Native Messaging里面的名字 之后会讲到。

runtime.connectNative这种方法连接我们的Native Messaging然后利用 postMessage 去发送我们要的信息给我们的本地应用

当然这里我们能够替换为 sendNativeMessage 直接给本地应用传值详见

https://developer.chrome.com/extensions/runtime#method-connectNative

我们在来看看ContentScript: content.js这个文件

 

<span style="font-family:SimSun;"><span style="font-size:18px;">var launch_message;

document.addEventListener('myCustomEvent', function(evt) {

chrome.runtime.sendMessage({type: "launch", message: evt.detail}, function(response) {

  console.log(response)

});

}, false);</span><strong>

</strong></span>

非常easy, 响应了一个页面中的事件"myCustomEvent", 同一时候公布一个消息给我们的后台文件background.js，这个消息包括了消息标示 "launch" 和 我们要传的值 evt.detail

关于Content Script 的信息 详见 https://developer.chrome.com/extensions/content_scripts

到这里我们的google插件部分就做好了

别忘了在Chrome 插件里开启开发人员模式 并载入这个插件

-------------------------------------切割线-------------------------------------

我们在来看看 Native Messaging 部分 我们再建一个 json 文件 我这里也叫做manifest.json(名字能够不是这个) 存在了我本地C:/Native文件夹下

<span style="font-family:SimSun;font-size:18px;">{

	"name": "com.my_company.my_application",

	"description": "Chrome sent message to native app.",

	"path": "C:\\MyApp.exe",

	"type": "stdio",

	"allowed_origins": [

		"chrome-extension://ohmdeifpmliljjdkaehaojmiafihbbdd/"

	]

}</span>

这里我们定义了 Native Messaging 的名字, 在path中定义了我们要执行的本地应用程序, allowed_origins 中长串的字符是我们插件的id 能够在安装插件后从google chrome 插件里看到(安装插件 能够在chrome中插件开启开发人员模式并加载我们之前的插件文件包)

完毕这步以后我们须要在WIndows 注冊表 中增加google 项目详细例如以下:

执行-> Regedit -> HKEY_Current_User->Software->Google->Chrome->新建一个叫NativeMessagingHosts的项->新建一个叫com.my_company.my_application的项,  同一时候在这个项里默认值设置为我们Native Messaging
的 位置 C:\\Native\\manifest.json

这样我们就完毕了NativeMessaging的设置

-------------------------------------我是切割线-------------------------------------

我们再来看看这个插件怎样和我们的站点交互

先建一个简单的网页内容例如以下

<span style="font-family:SimSun;font-size:18px;"><!DOCTYPE HTML>

<html>

<head>

<script>

function startApp() {

	var evt = document.createEvent("CustomEvent");

	evt.initCustomEvent('myCustomEvent', true, false, "im information");

	// fire the event

	document.dispatchEvent(evt);

}

</script>

</head>

<body>

<button type="button" onClick="startApp()" id="startApp">startApp</button>

</body>

</html>

</span>

里面有一个简单的button， 这个button会启动方法, 新建一个名叫"myCustomEvent"的事件, 同一时候附带有我们要传的信息, 并公布这个事件。 这样我们插件中的Content.js 就能够接收并响应这个事件了!

-------------------------------------我是切割线-------------------------------------

我们最后再来看看C#程序, 随便做一个很easy的程序, 放到了

C://MyApp.exe这里

在Main里面 我们能够增加以下这种方法, 利用Console.OpenStandardInput这个 我们能够接收到由页面传到我们应用的值并进行我们想要的一些操作, 在这里我们用一个log4net 记录我们程序执行情况

[assembly: log4net.Config.XmlConfigurator(Watch = true)]

namespace MyApp

{

    static class Program

    {

        public static log4net.ILog log = log4net.LogManager.GetLogger(System.Reflection.MethodBase.GetCurrentMethod().DeclaringType);

        [STAThread]

        static void Main(string[] args)

        {

            if (args.Length != 0)

            {

                string chromeMessage = OpenStandardStreamIn();

                log.Info("--------------------My application starts with Chrome Extension message: " + chromeMessage + "---------------------------------");

	        }

	    }

        private static string OpenStandardStreamIn()

        {

            //// We need to read first 4 bytes for length information

            Stream stdin = Console.OpenStandardInput();

            int length = 0;

            byte[] bytes = new byte[4];

            stdin.Read(bytes, 0, 4);

            length = System.BitConverter.ToInt32(bytes, 0);

            string input = "";

            for (int i = 0; i < length; i++)

            {

                input += (char)stdin.ReadByte();

            }

            return input;

        }

    }

}


点击我们在页面上增加的button, 然后检查log文件:


2014-07-30 09:23:14,562 [1] INFO  MyApp.Program ----------------------------------------My application starts with Chrome Extension message: {"message":"im information"}---------------------------------


最后一张图总结下整个过程




watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvTmljb2xhc18wMDg=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">


假设想要在安装我们本地软件时安装这个插件, 我们须要把我们的插件先公布到Chrome web store上详见https://developer.chrome.com/extensions/external_extensions


我将不赘述




版权声明：本文博客原创文章。博客，未经同意，不得转载。


												


											
Chrome 小工具: 启动本地应用 (Native messaging)的更多相关文章
	

    
								
  1. Chrome 插件: 起动本地应用 (Native messaging)
		
    Chrome 插件: 起动本地应用 (Native messaging) www.MyException.Cn  网友分享于:2014-08-01  浏览:3次   Chrome 插件: 启动本地应用 ...
    
		
    2. 
						
  2. chrome浏览器插件启动本地应用程序
		
    chrome浏览器插件启动本地应用程序 2014-04-20 00:04:30|  分类: 浏览器插件|举报|字号 订阅     下载LOFTER我的照片书  |     chrome的插件开发这里就 ...
    
		
    3. 
						
  3. 推荐几个我一直在使用chrome小工具（上）
		
    我用的chrome插件挺多的,所谓工欲善其事必先利其器,我热衷于搜寻好用的工具来让我平时的工作事半功倍. 以下介绍几款我正在用的感觉还不错的插件,假设大家还有其他好用的(肯定有,chrome插件库太庞 ...
    
		
    4. 
						
  4. R shiny 小工具Windows本地打包部署
		
    目录 服务器部署简介 windows打包部署 1. 部署基本框架 2.安装shiny脚本需要的依赖包 3.创建运行shiny的程序 [报错解决]无法定位程序输入点EXTPTE_PTR于动态链接库 将小 ...
    
		
    5. 
						
  5. 如何通过写一个chrome扩展启动本地程序
		
    @(编程) [toc] 本文介绍如何利用Chrome 的插件, 从我们的一个网站中启动一个我们的本地程序.本文的环境是windows10,本文的例子是通过点击网页上的一个button,调用本地的wor ...
    
		
    6. 
						
  6. C# 基础知识系列- 17 小工具优化
		
    0. 前言 不知道有没有动手能力强的小伙伴照着上一篇的内容写过程序呢?如果有的话,应该会在使用的时候发现以下几个问题: 每次启动都需要经过漫长的时间去遍历磁盘里的文件目录 因为数据是用的字典保存的,所 ...
    
		
    7. 
						
  7. Chrome浏览器扩展开发系列之十四：本地消息机制Native messaging
		
    通过将浏览器所在客户端的本地应用注册为Chrome浏览器扩展的“本地消息主机(native messaging host)”,Chrome浏览器扩展还可以与客户端本地应用之间收发消息. 客户端的本地应 ...
    
		
    8. 
						
  8. Chrome Native Messaging 与本地程序之间的通信
		
    最近项目上出现了web打印不稳定的问题,师父决定web调用本地打印程序,在查阅了相关资料和加了几个相关群咨询后得知新版的chrome不支持NNAPI了,最好用Native Messaging来处理,经 ...
    
		
    9. 
						
  9. 实现chrome扩展启动本地进程 - 补充
		
    实现chrome扩展启动本地进程 - 补充 标签: chrome扩展启动本地程序访问本地磁盘 2014-10-17 11:42 6753人阅读 评论(17) 收藏 举报  分类: Chrome Plu ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 轻松学习之Linux教程一 ubuntu14.04+windows双系统安装
			
    本系列文章由@uid=hpw" style="color:rgb(255,0,0)">超人爱因斯坦出品.转载请注明出处.          文章链接:http:// ...
    
			
    2. 
						
  2. ios 上拉载入下拉刷新Dome
			
    为练手写了一个小的上拉载入很多其它下拉刷新的小的Dome . 没有太多的技术含量,仅仅是作为新手的启示用.是上一篇下拉载入的扩展.先看一下那个再看这个就easy非常多. Dome下载:http://d ...
    
			
    3. 
						
  3. 【VBA研究】查找目录以下全部文件的名称
			
    作者:iamlaosong 目录里面保存有面单扫描的图像文件,文件名称为邮件号码.如今想收集这些邮件号码,由于量非常大,不可能一个一个的截取,仅仅能通过程序实现.假定,当前工作表B列里放的是存放这些图 ...
    
			
    4. 
						
  4. Hadoop-2.2.0中国文献—— MapReduce  下一代 -- 公平调度
			
    目的 此文档描写叙述了 FairScheduler, Hadoop 的一个可插入式的调度器.同意 YARN 应用在一个大集群中公平地共享资源. 简单介绍 公平调度是一种分配资源给应用的方法,以致到最后 ...
    
			
    5. 
						
  5. BZOJ 1176([Balkan2007]Mokia-CDQ分治-分治询问)
			
    1176: [Balkan2007]Mokia Time Limit: 30 Sec   Memory Limit: 162 MB Submit: 185   Solved: 94 [ Submit] ...
    
			
    6. 
						
  6. SE 2014年4月29日
			
    交换网络中有vlan1 到20个vlan,要求使用MSTP技术实现vlan的负载分担. SW2为实例1(vlan1-vlan10)的主根,SW3为备根 SW3为实例2(vlan11-vlan20)的主 ...
    
			
    7. 
						
  7. Knockout应用开发指南 第十章：更多信息（完结篇）
			
    原文:Knockout应用开发指南 第十章:更多信息(完结篇) 1   浏览器支持 Knockout在如下浏览器通过测试: Mozilla Firefox 2.0+(最新测试版本:3.6.8) Goo ...
    
			
    8. 
						
  8. Redis 的性能幻想与残酷现实（转）
			
    2011 年,当初选择 Redis 作为主要的内存数据存储,主要吸引我的是它提供多样的基础数据结构可以很方便的实现业务需求.另一方面又比较担心它的性能是否足以支撑,毕竟当时 Redis 还属于比较新的 ...
    
			
    9. 
						
  9. Java EE (12) -- 系统质量的分类
			
    明显的 性能(Performance): 对响应用户的应答时间的度量.可靠性(Reliability): 对包括后台存储和给用户的表示结果在内的数据正确的可能性的度量.可用性(Availability ...
    
			
    10. 
						
  10. Git双机同步
			
    如果使用git init 初始化,当客户端仓库push内容时,服务器端仓库可以看到log,但是更新的文件不能显示,必须使用git reset --hard才能更新内容
    
			
    11.