谷歌插件

187 阅读5分钟

white-space: pre-line; word-wrap: break-word; {name: 'BelongMyClue', params: {isTips: true}} {path:'/one/log',query:{num:123}} }

{
	"manifest_version": 2,							// 目前只能为数字2(必需)
	"name": "查看我的IP",							// 插件名字(必需)
	"version": "1.0",								// 插件版本(必需) 值最多可以是由三个圆点分为四段的版本号,每段数字不能大于65535 且不能以0 开头(可以是0)
	"description": "查看我的电脑当前的公网IP",		// 插件详情
	"icons": {										// 扩展相关图标文件的位置
		"16": "images/icon16.png",
		"48": "images/icon48.png",
		"128": "images/icon128.png"
	},
	"browser_action": {								// 指定扩展的图标放在Chrome 的工具栏中
		"default_icon": {							// 相应图标文件的位置
			"19": "images/icon19.png",
			"38": "images/icon38.png"
		},
		"default_title": "查看我的IP",				// 当用户鼠标悬停于扩展图标上所显示的文字
		"default_popup": "popup.html"				// 当用户单击扩展图标时所显示页面的文件位置
	},
	"page_action": {
		"default_icon": {
			"19": "images/icon19.png",
			"38": "images/icon38.png"
		},
		"default_title": "Extension Title",
		"default_popup": "popup.html"
	},
	"background": {									// 可以使扩展常驻后台
		"scripts": ["*.js"],						// 如果指定了scripts 属性,则Chrome 会在扩展启动时自动创建一个包含所有指定脚本的页面
		"page":["*.html"],							// 作为后台页面运行
		"persisten": blo							// 常驻后台的方式——当其值为true 时,表示扩展将一直在后台运行;当其值为false 时,表示扩展在后台按需运行
	},
	"content_scripts": [							//前台页面用到的文件配置,可以多个
		{
			"matches": ["*://*/*"],					//定义在什么地址下加载
			"css": ["mystyles.css"],				//要加载的css
			"js": ["jquery.js", "myscript.js"]		//要加载的js
		}
	],
	"options_page": "options.html",					// 指定应用右键菜单里设定'选项'的页面
	"permissions": ["*://*/*"],						// 权限:URL正则告诉chrome允许跨域的地址,'contextMenus'添加页面右键菜单,'notifications'桌面提醒功能,'cookies'管理cookies
													   同时要声明需管理cookies所在的域
	"web_accessible_resources": ["images/*.png"]
}




/*************************  Browser Actions 接口(只在popup页面打开时可以调用)  *************************/

chrome.browserAction.setIcon({			// 动态更改扩展的图标
	path:imagePath,						// imagePath为图片在扩展根目录下的相对位置
	imageData:imageData,				// 值可以是imageData,也可以是对象。imageData 是图片的像素数据,可以通过HTML 的canvas 标签获取到
	tabld:''							// 限定了浏览哪个标签页时,图标将被更改
},callback);							// 当chrome.browserAction.setIcon 方法执行成功后,callback 指定的函数将被运行。此函数没有可接收的回调结果

chrome.browserAction.setTitle({			// 动态更改扩展的标题
	title: 'This is a new title'
}); 

chrome.browserAction.setBadgeBackgroundColor({
	color: '#0000FF'
});
chrome.browserAction.setBadgeText({
	text: 'Dog'
});




/*************************  Browser Actions 接口(只在popup页面打开时可以调用)  *************************/
Page ActionsBrowser Actions 非常类似,除了Page Actions 没有badge 外,其他Browser Actions 所有的方法Page Actions 都有,
它还具有独有的show和hide 方法
chrome.pageAction.show(integer tabId);
chrome.pageAction.hide(integer tabId);





/*************************  扩展页面间相互通信  *************************/
Chrome 提供的大部分API 是不支持在content_scripts 中运行的, 但runtime.sendMessage 和runtime.onMessage 可以在content_scripts 中运行,所以扩展的其他页面也可以同content_scripts 相互通信。

chrome.runtime.sendMessage('***',function(callObj){ do some thing });			// 前台向后台转递信息和callBackFn,callBackFn可以接收后台返回的信息并处理
chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){		// 后台接收到前台传递的信息做处理,执行回调并返回信息
	if(message == '***'){
		do some thing;
		sendResponse('other***');
	}
})
runtime.connect
runtime.onConnect
API地址:http://developer.chrome.com/extensions/extension





/***************************  储存数据  ***************************/
Chrome 扩展使用以下三种方法中的一种来储存数据:
	1、使用HTML5localStorage;
		首先localStorage 是基于域名的,而content_scripts 是注入到用户当前浏览页面中的,如果content_scripts 直接读取localStorage,所读取到的数据是用户当前浏览页面所在域中的。所以通常的解决办法是content_scripts 通过runtime.sendMessage 和background 通信,由background 读写扩展所在域(通常是chrome-extension://extension-id/)的localStorage,然后再传递给content_scripts。
	2、使用Chrome 提供的存储API;
		使用Chrome 存储API 必须要在Manifest 的permissions 中声明"storage",之后才有权限调用。Chrome 存储API 提供了2 种储存区域,分别是sync 和local。两种储存区域的区别在于,sync 储存的区域会根据用户当前在Chrome 上登陆的Google 账户自动同步数据,当无可用网络连接可用时,sync 区域对数据的读写和local 区域对数据的读写行为一致。(具体看Chrome扩展及应用开发第2.6节)
	3、使用Web SQL Database。
		关于Web SQL Database 的资料可以参考http://www.w3.org/TR/webdatabase/







/***************************  右键菜单  ***************************/
Chrome 提供了三种方法操作右键菜单,分别是create、update 和remove,对应于创建、更新和移除操作。
右键菜单提供了4 种类型:
	1、普通菜单'normal',
	2、单选菜单'radio',
	3、复选菜单'checkbox',
	4、分割线'separator'

chrome.contextMenus.create({
	'type': 'radio',		// 菜单类型
	'title': 'Menu B',		// 菜单显示内容
	'id': 'b',				// id,必需,绑定点击事件用
	'contexts':['page'],	// 定义的右键菜单在何时显示(可选,默认page):all\page\frame\selection\link\editable\image\video\audio\launcher (launcher只对Chrome 应用有效)
	'checked': true,		// 单选或多选用到,是否选中
	'parentId': 'a',		// 子菜单用到,父级type要是'normal'
	'onclick':fn			// 点击后调用函数
})
chrome.contextMenus.update(id,{ //更新id对应的右键菜单
	'title':'.....'
});
chrome.contextMenus.update(id);	//移除id对应的右键菜单

例子:chrome_extensions_and_apps_programming-master\chrome_extensions_and_apps_programming-master\google_translate



/***************************  桌面提醒  ***************************/
// 具体使用看https://jingyan.baidu.com/article/25648fc1a1ebcc9190fd005a.html
// "permissions"里要添加"notifications"
chrome.notifications.create('',{
	type: "list",
	title: "桌面提醒",
	message: "msg",
	iconUrl: "images/icon48.png",
	items: [
		{ title: "1.", message: "下班了"},
		{ title: "2.", message: "吃饭了."},
		{ title: "3.", message: "中奖了."}
	]
},function(id){
	
})



/***************************  Cookies  ***************************/
如果想要管理所有的Cookies 可以声明如下权限:
	"permissions": [
		"cookies",
		"<all_urls>"
	]
	请注意,除非必要,否则请不要如此声明权限,这会提示此扩展可以访问所有网络资源,给用户带来不安。
//取cookies
	chrome.cookies.get({								//单个
		url: 'https://github.com',
		name: 'dotcom_user'
	}, function(cookie){
		console.log(cookie.value);
	});
	chrome.cookies.getAll({}, function(cookies){		//全部
		console.log(cookies);
	});
//设置cookies
	chrome.cookies.set({
		'url':'http://github.com/test_cookie',
		'name':'TEST',
		'value':'foo',
		'secure':false,
		'httpOnly':false
	}, function(cookie){
		console.log(cookie);
	});
//删除Cookie。remove 方法可以删除指定url、name 和storeId 的Cookie。
	chrome.cookies.remove({
		url: 'http://www.google.com',
		name: '_ga'
	}, function(result){
		console.log(result);
	});
//获取全部的Cookie store
	chrome.cookies.getAllCookieStores(function(store){
		console.log(store)
	})
//onChanged事件监控Cookie的设置和删除行为
	chrome.cookies.onChanged.addListener(function(changeInfo){
		console.log(changeInfo);	//changeInfo 包含三个属性:
										removed,是否是删除行为;
										cookie,被设置或删除的cookie对象;
										cause,Cookie 变化的原因,可能的值包括evicted、expired、explicit、expired_overwrite和overwrite。
	})
	
	
	


插件源码在本地位置 C:\Users\Lenovo\AppData\Local\Google\Chrome\User Data\Default\Extensions	(win7)
进度:4.2





chrome.extensions(plugin)   API: https://developer.chrome.com/extensions/devguide



https://chrome.google.com/webstore/search/megabonus
https://chrome.google.com/webstore/detail/ali-reviews-aliexpress-re/bbaogjaeflnjolejjcpceoapngapnbaj
https://chrome.google.com/webstore/search/aliexpress%20pictures%20and%20images