记开发firefox extension
浏览:2493次 出处信息
关于调试
开启你的extension log功能。
打开about:config,通过filter找到:extensions.logging.enabled,将其设置为true。
它将使你的extension调试更方便。
安装一个mr tech toolkit插件,可以在附加组件内容,选中某个插件右键,直接到插件目录。
关于xul布局
xul就不说了,语法比较简单,也支持CSS,不清楚的话还可以看参考手册,只是制作插件时需要不停的重启firefox。
所以有个可视化编辑xul,又不需要重启firefox的工具是很重要的,可以下载xul explorer。
布局里值得说的一点是,vbox、hbox、spacer,这两个元素是XUL布局里重要的组成部分。
- 简单的说就是用vbox包起来的元素,子节点里的所有元素就是垂直的。
- hbox类似,子节点所有都是横向排列。
- spacer就是填入空白(当然,如果你不用它,直接用CSS布局也可)。
鼠标右键菜单
知道这些之后,如果你要写一个右键菜单。例如:
<popup id="contentAreaContextMenu">
<menuseparator />
<menuitem id="kb-context-menu" label="右键菜单" oncommand="nsNamespace.method();" image="chrome://kb/content/new.png"/>
</popup>
<menuseparator />
<menuitem id="kb-context-menu" label="右键菜单" oncommand="nsNamespace.method();" image="chrome://kb/content/new.png"/>
</popup>
另外,我原来想偷懒,想在xul里嵌一个iframe解决所有问题,但貌似嵌入进去后里面的textarea无法使用,完全被disabled掉了,所以后来放弃使用iframe。老老实实的用xul的textbox来做UI。
不一致性的奇怪现象
如果要给某个元素加css text-decoration:underline下划线,文本必须在attribute里才能加上,例如<label value="test" style="text-decoration:underline">就正常出现下划线,而如果你要是<label style="text-decoration:underline">test</label>则无效。
而text元素又恰与上描述相反,看demo吧。
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<?xml-stylesheet href="mycss.css" type="text/css"?>
<window title="test01.xul" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<groupbox>
<caption label="Underline problem"/>
<label style="color: red;text-decoration: underline">Text as element content: underline doesn't work.</label>
<label style="color: red;text-decoration: underline" value="Text as an element attibute: underline works!"/>
</groupbox>
<groupbox>
<caption label="Blink problem"/>
<label style="color: red;text-decoration: blink">Text as element content: blink works!</label>
<label style="color: red;text-decoration: blink" value="Text as an element attribute: blink doesn't work."/>
</groupbox>
</window>
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
<?xml-stylesheet href="mycss.css" type="text/css"?>
<window title="test01.xul" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<groupbox>
<caption label="Underline problem"/>
<label style="color: red;text-decoration: underline">Text as element content: underline doesn't work.</label>
<label style="color: red;text-decoration: underline" value="Text as an element attibute: underline works!"/>
</groupbox>
<groupbox>
<caption label="Blink problem"/>
<label style="color: red;text-decoration: blink">Text as element content: blink works!</label>
<label style="color: red;text-decoration: blink" value="Text as an element attribute: blink doesn't work."/>
</groupbox>
</window>
值得copy的一些代码
读取、存储用户配置信息
//从conf里读取存储的信息
var prefs = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefBranch).getBranch("extensions.pluginname.");
var username = prefs.getCharPref('username')||'';
var password = prefs.getCharPref('password')||'';
//存储用户信息到config
var prefs = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefBranch);
prefs.setCharPref("username", user.value); //以字符串形式存储
prefs.setCharPref("password", pass.value); //以字符串形式存储
var prefs = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefBranch).getBranch("extensions.pluginname.");
var username = prefs.getCharPref('username')||'';
var password = prefs.getCharPref('password')||'';
//存储用户信息到config
var prefs = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefBranch);
prefs.setCharPref("username", user.value); //以字符串形式存储
prefs.setCharPref("password", pass.value); //以字符串形式存储
在新tab里打开一个URL
var openUrl = function(url) {
var wnd = window.top.getBrowser().selectedBrowser.contentWindow;
wnd.open(url);
};
openUrl('http://www.never-online.net');
var wnd = window.top.getBrowser().selectedBrowser.contentWindow;
wnd.open(url);
};
openUrl('http://www.never-online.net');
关于打包发布,及自动更新
extension更新有大概三种方式:
- 到addon上官方注册,这个对于个人来说不用去想什么了,没什么可操作性。――略过。
- 更新协议用https,然后到CA买证书,不知道CA的同学点这里――要银子。
- 可以用http协议,第一次打包时将install.rdf安装文件签名,每次更新包时,用该签名来生成update.rdf文件,然后用sha1算法保证XPI安装包的正确性。――靠谱。
- mcCoy,一个mozilla develop网上推荐的签名工具。可以点这里下载,如上所述,是用来签名你的XPI安装包的。
- sha1sum.exe,一个命令行下的执行文件,用sha1算法来算XPI安装包的程序(注意,命令行下有效)。点这里下载
- mcCoy创建一个新key。
- 点击install按钮找到install.rdf,使之签名。如果你的install.rdf格式正确,mcCoy程序会自动将该文件写入签名。
如果不知道写install.rdf格式的同学看文末,我会给出template。
(注意:如果该文件格式不对,或损坏,firefox安装时会提示该文件有误的)。
- 签名好install.rdf之后,就可以发布了,但发布之前提醒最好先测试一下自动更新的过程是否有问题。
- 接下来用sha1sum.exe来算你要更新的XPI更新包,算好之后,把值放到em:updateHash属性里。
- 最后,就要用现在这个key去签名你的update.rdf文件。即点击sign按钮找到update.rdf文件进行签名。
这个步骤和签install.rdf一样,如果你的update.rdf文件格式无误,mcCoy也会自动将update.rdf文件写入签名。
如果不知道写update.rdf格式的同学看文末,我会给出template。
需要注意的是:如果你的update.rdf文件有误,是会提示验签失败的,也不知道firefox会不会优化这个提示,很建议继续学习:
- Firefox的about 页面 (阅读:12976)
- 分享一个JQUERY颜色选择插件 (阅读:12630)
- jQuery Color Animations颜色动画插件 (阅读:7070)
- 精于图片处理的10款jQuery插件 (阅读:6203)
- vim 常用插件推荐 (阅读:5959)
- PHP Extension开发基础 (阅读:5658)
- WordPress插件开发 -- 在插件使用数据库存储数据 (阅读:5601)
- nyroModal:强大的jQuery弹出层插件 (阅读:4771)
- vim的一个js代码整理的插件jsbeautify.vim (阅读:4673)
- 如何创建google浏览器插件 (阅读:3824)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
<< 前一篇:网银支付接口编程资料汇总
文章信息
- 作者:Rank 来源: never-online
- 标签: extension firefox 插件
- 发布时间:2010-05-28 13:07:30
建议继续学习
近3天十大热文
- [67] Go Reflect 性能
- [67] Oracle MTS模式下 进程地址与会话信
- [67] 如何拿下简短的域名
- [61] IOS安全–浅谈关于IOS加固的几种方法
- [60] 图书馆的世界纪录
- [59] android 开发入门
- [59] 【社会化设计】自我(self)部分――欢迎区
- [56] 视觉调整-设计师 vs. 逻辑
- [49] 给自己的字体课(一)——英文字体基础
- [47] 界面设计速成