首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 其他教程 > 开源软件 >

FireFox Extension - 一个容易的例子

2014-01-13 
FireFox Extension---一个简单的例子1、创建简单的FF?插件的参考资料地址:https://developer.mozilla.org/e

FireFox Extension --- 一个简单的例子

1、创建简单的FF?插件的参考资料地址:

https://developer.mozilla.org/en-US/docs/Building_an_Extension

?

建立一个简单的Hello?world

①、在eclipse中没有安装FF?extension开发的插件之前,先手动创建一个简单的FF插件,对于理解FF插件的开发是很有帮助的,建立一个普通的项目,建立如下的目录结构:

FireFox Extension  -  一个容易的例子

?

?

?

②、编写install.rdf文件

Install.rdf名字是固定的,位置也是固定的,它是用来描述整个插件的各种信息,包括提供者,版本号,ID等等,另外还可以提供了嵌入用户提供页面的功能,比如嵌入用户提供的option功能(<em:optionsURL>)等等。

<?xml?version="1.0"?>

<RDF?xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"

xmlns:em="http://www.mozilla.org/2004/em-rdf#">

?

<Description?about="urn:mozilla:install-manifest">

<em:name>HelloWorld</em:name>

<em:version>1.0</em:version>

<em:description>A?test?extension</em:description>

<em:creator>Irving?Sun</em:creator>

<em:id>helloWorld@cn.irving.com</em:id>

?

<em:targetApplication>

<Description>

<em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>

<em:minVersion>1.5</em:minVersion>

<em:maxVersion>30.0.*</em:maxVersion>

</Description>

</em:targetApplication>

?

<em:iconURL></em:iconURL>

<em:homepageURL></em:homepageURL>

</Description>

</RDF>

?

③、编写XUL文件

XUL(XML?User?Interface?Language),是一种Mozilla开发的一种使用XML进行用户界面描述的语言,在FF中,XUL文件可以直接访问,而且显示出来的就是一个页面。

?

另外,FF的整个界面都是通过XUL描述的,所以自然就可以把我们编写的XUL界面嵌入到FF浏览器中,以插件的界面的形式显示出来。

?

<?xml?version="1.0"?>?

<overlay?id="sample"??xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">?

<statusbar?id="status-bar">?

????<statusbarpanel?id="hello-panel"?label="HelloWorld"????/>?

</statusbar>?

</overlay>

XUL文档基于这个overlay标签进行扩展,从字面上可以看出,此处扩展了statusbar,添加了一个id为"hello-panel"的panel,并且上面添加上"hello-panel"。

?

④、关联chrome.manifest

FF对于资源的定位,自己定义了chrome://协议,类似于HTTP协议的使用。在FF的安装目录下,有一个browser包,里面会有类似于content/browser/browser.xul的文件,如果要访问这个资源,我们可以在FF的地址栏输入:chrome://browser/content/browser.xul

?

我们添加如下的关联代码:

content?????????sample????????chrome/content/

overlay?chrome://browser/content/browser.xul???chrome://sample/content/sample.xul

?

第一句表示:

当我们请求chrome://sample/content/目录下的资源的时候,将返回chrome/content/目录下的资源。sample表示包名,content表示请求类型。

第二句表示:

当我们请求chrome://browser/content/browser.xul的时候

将chrome://browser/content/browser.xul也扩展进来。


⑤编写build脚本

主要的任务就是将我们需要的东西都打包到一个后缀名为.xpi的文件里。

<project?name='test'?default='xpi'>

<property?name="src.dir"?value="."?/>

<property?name="dist.dir"?value="dist"?/>

<property?name="app.xpi.id"?value="helloWorld@cn.ibm.com"?/>

?

<target?name='xpi'?depends='clean'>

<mkdir?dir="${dist.dir}"/>

<zip?destfile="${dist.dir}/${app.xpi.id}.xpi">

<fileset?dir="${src.dir}">

<include?name='chrome/**'/>

<include?name="chrome.manifest"?/>

<include?name="install.rdf"?/>

</fileset>

</zip>

</target>

?

<target?name='clean'>

<delete?dir='${dist.dir}'?/>

</target>

</project>

?

运行之后,就会在当前目录下生成一个dist文件夹,我们需要的文件就在里面。

?

⑥调试

将生成的xpi文件拖到FF中,稍等一会儿就会出现安装的提示了。安装完了之后,重启FF,就可以在FF的右下角看到如下的信息:

FireFox Extension  -  一个容易的例子

关于调试,调试JS?的快捷键”Ctrl+Shift+j”

<!--EndFragment-->

热点排行