插件的manifest.json文件:
{ "manifest_version" : 2, "name" : "保存网页为PDF" , "version" : "1.1.7.80" , "description" : "保存网页为PDF【作者:涂剑凯,邮箱:bdstjk@qq.com】" , "icons" :{ "16" : "Images/16.png" , "48" : "Images/48.png" , "128" : "Images/128.png" }, "background" : { "page" : "background.html" }, "options_page" : "options.html" , "browser_action" : { "default_icon" : "Images/16.png" , "name" : "保存网页为PDF" }, "permissions" : [ "tabs" , "http://localhost:9240/" , "activeTab" , "notifications" , "storage" , "http://*/" ], "update_url" : "http://localhost:9240/SaveService/GetUpdateXML" } |
必须属性:name、version、manifest_version
1、name 顾名思义就是你的插件的名称;
2、version 指你的插件的版本号;
3、manifest_version 指定清单文件格式的版本,在Chrome18之后,应该都是2,所以这个值直接设定为2就OK了;
推荐属性:description、icons、default_locale
1、description 插件描述,简单介绍插件用途;
2、icons 插件图标,需准备16*16(扩展信息栏)、48*48(扩展管理页面)、128*128(用在安装过程中)的三个图标文件,建议为PNG格式,因为PNG对透明的支持最好;
3、default_locale 国际化支持,支持何种语言的浏览器,虽然官方推荐,不过我没用;
background
这是一个比较重要的属性,如果你需要运行一些后台脚本,比如监听用户在扩展信息栏按下你的插件图标,或者你要监听用户新建tab页,这个时候你就需要有一个background的页面。background你可以指定一个HTML页面(如我的插件),也可以指定一个JS文件,如:
{ "name": "My extension", ... "background": { "scripts": ["background.js"] }, ... }
{ "name": "My extension", ... "background": { "scripts": ["background.js"] }, ... }
需要注意两点:
1、是HTML不能写JS代码,JS代码需要写到JS文件中后引入;
2、不能使用jquery(没有详细测试,可能是我没用正确);
监听用户在扩展信息栏按下你的插件图标时,显示当前活动页的URL:
chrome.browserAction.onClicked.addListener(function (tab) { alert(tab.url); });
chrome.browserAction.onClicked.addListener(function (tab) { alert(tab.url); });
参见:https://developer.chrome.com/extensions/background_pages.html
options_page
options_page指定你的插件设置页面,这个看个人需求而定,可以不设置。
需要注意两点:
1、你需要将JS写到一个JS文件中后引入;
2、不能有HTML元素的内联事件(如<button onclick="...">
),你需要通过JS给HTML元素绑定事件如:
$(document).ready(function () { $("#btnOpenSetting").click(function () { OpenSetting(); }); });
$(document).ready(function () { $("#btnOpenSetting").click(function () { OpenSetting(); }); });
browser_action
browser_action可以设置扩展信息栏的图标、图标悬浮提示、点击图标是弹出窗口(我的插件不需要弹出窗口所以未设置);
给大家看一个完整例子:
{ "name": "My extension", ... "browser_action": { "default_icon": { // optional "19": "images/icon19.png", // optional "38": "images/icon38.png" // optional }, "default_title": "Google Mail", // optional; shown in tooltip "default_popup": "popup.html" // optional }, ... }
{ "name": "My extension", ... "browser_action": { "default_icon": { // optional "19": "images/icon19.png", // optional "38": "images/icon38.png" // optional }, "default_title": "Google Mail", // optional; shown in tooltip "default_popup": "popup.html" // optional }, ... }
permissions
permissions对于manifest.json来说虽然不是必要属性,但是对于我们开发插件来说却是必要的manifest.json,我们总要向chrome申请点权限,才能完成我们的插件;
这里我就只介绍我的插件里面用到的权限(当然其实有点权限我最后也没用):
"tabs", 访问浏览器选项卡
"http://localhost:9240/", AJAX访问localhost:9240的权限
"activeTab", 获取当前活动选项卡
"notifications", 浏览器通知(基于HTML5的通知实现)
"storage", 存储,希望存储一些设置的话,就需要用到
"http://*/" 访问任意域名的权限
update_url
update_url指定自动更新地址,如果你是通过chrome官方发布插件,这个属性不需要设置;但如果跟我一样通过非官方发布,这个属性就很巴适了;你只需要第一次拖拽安装插件,以后都能自动更新了。这里给一个update_url需要返回的数据格式例子:
<?xml version='1.0' encoding='UTF-8'?> <gupdate xmlns='http://www.google.com/update2/response' protocol='2.0'> <app appid='aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa'> <updatecheck codebase='http://myhost.com/mytestextension/mte_v2.crx' version='2.0' /> </app> </gupdate>
<?xml version='1.0' encoding='UTF-8'?> <gupdate xmlns='http://www.google.com/update2/response' protocol='2.0'> <app appid='aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa'> <updatecheck codebase='http://myhost.com/mytestextension/mte_v2.crx' version='2.0' /> </app> </gupdate>
manifest.json就介绍到这里。