当前位置: 首页 > Linux学院 > 程序开发 > 编程应用 > 为Firefox编写一个基础浏览器扩展

为Firefox编写一个基础浏览器扩展

2013-08-03 15:05 来源:IBM 作者:Duane O'Brien 人气指数: 我要评论

回忆一下,Gawkblocker 支持您(以及其他用户)屏蔽某些您不喜欢访问的域,比如耗时的博客。Gawkblocker 有以下组件:

一个弹出窗口(显示您将要屏蔽的域)
一个可见的浏览器图标(扩展的入口点)
一个选项页面(配置您想要屏蔽以及想要访问的域)
在 Chrome 中,Gawkblocker 扩展将向每个选项卡或窗口添加一个监听程序,并与黑名单进行匹配,这会将屏蔽的 URL 重定向到一个本地页面。现在,您将学习 Gawkblocker 扩展在 Firefox 中如何变化。

Gawkblocker 以特定的方式扩展至浏览器,进行一些将在其他扩展中进行的特定工作。正如 第 1 部分 所述,您需要回答以下这些问题:

在浏览器 UI 中拥有一席之地有多难?
持久化浏览器会话间的数据涉及到什么?
不同扩展部分彼此如何通信?
您对用户数据的研究有多深入?
完成 Firefox 的 Gawkblocker 构建流程后就可以回答这些问题。

 开始之前

对于本文,您需要下载和安装 Firefox V12 或更高版本(参阅 参考资料)。(本文示例也是基于 Firefox V12)您也需要一些可以编辑 HTML、CSS 和 JavaScript 的工具。如果您有使用 Firefox 或者 Firefox 附件的经验将会很有帮助。如果没有这方面的经验,那么请浏览 Mozilla Add-ons 页面上提供的扩展(参阅 参考资料)。试用一下本文提供的几个上下文扩展。

您的参考文档是 Mozilla Add-on SDK 开发人员指南(参阅 参考资料)。您可使用 Add-on Builder(一个基于 Web 的工具,用于构建 Firefox 扩展)完成大多数工作。Add-on Builder 是 Jetpack(一个 Firefox 项目)的一部分。Jetpack 的目的是使仅使用 HTML、CSS 和 JavaScript 编写扩展变得更为容易(正如您为 Chrome 扩展所做的一样)。也可使用 其他方法 来构建 Firefox 扩展。

Firefox 扩展剖析

使用 Add-on Builder 构建的 Firefox 扩展可使用 CommonJS 约定导入所需的库。扩展中可以包括 HTML、CSS 和 JavaScript 文件的任意组合,但都是以 main.js 文件开始。

main.js 文件是 Firefox 扩展的核心。该文件告诉 Firefox 导入哪个模块,以及在何处执行扩展的初始化任务。回顾 第 1 部分 中的 Chrome 扩展。main.js 类似于 background.html 页面。main.js 在后台运行,与 Firefox 没有直接交互,而且在启动过程中仅运行一次。

也可以将大量页面显示在 Firefox 扩展的 panel 中。可以将这类页面作为一个弹出和选项窗口的组合页面,如图 1 所示:

图 1. 弹出/选项页面
Gawkblocker 弹出/选项页面屏幕截图

您也可以使用 Firefox 中的内容脚本,与在 Chrome 中使用的方法基本相同。内容脚本是可以添加到 Web 页面进行交互的 JavaScript 文件。在 Firefox 中,内容脚本可在页面上下文中有效地运行。但是访问 DOM 或从 DOM 中获取都可以进行代理以防止出现安全问题。内容脚本可使用 port 与其他扩展进行通信。

对于 Gawkblocker,您可以使用:

  • 一个 main.js 文件
  • 一个包含核心功能(大多数都是从 Chorme 扩展中移植过来)的 JavaScript 文件
  • 一个弹出/选项窗口的组合页面
  • 一个或两个图标

Firefox 实现比 Chrome 略微简单点,但是用户体验效果实际上是一样的。您可以从我的 Add-on Builder 配置文件中下载一个正在运行的 Gawkblocker 文件来查看活动的扩展,和我在此处介绍的其他部分一样。

使用 Add-on Builder

要使用 Add-on Builder,根据图 2 所示以及在 https://builder.addons.mozilla.org/ 中提供的信息,必须完成注册过程。然后,可以登录到 Add-on Builder 创建自己的附件。

图 2. Add-on Builder
Mozilla Add-on Builder 屏幕截图

构建 Add-on Builder 界面的完整过程不在本文的讨论范围之内,但是在文件结构中有两点需要注意。Lib 目录是使用 require 导入库时 Firefox 所要查找的目录。您可以将 Gawkblocker 的核心 JavaScript 类放在该目录下。Data 目录是存放图像、HTML、CSS 和扩展可能提供的其他资产的位置。

当构建一个附件并对其进行测试时,可能会提示您安装 Add-on Builder 帮助程序。该帮助程序可在开发过程中卸载和安装附件。

为您推荐: firefox 浏览器扩展

其他相关的新闻

大家感兴趣的内容
小伙伴最爱的新闻
小伙伴还关注了以下信息
小伙伴关注的焦点

小伙伴都在关注的热门词

新服 缤纷活动 航海世纪 芈月传 暗黑道具 萌乐网 苹果发布会 最新谍照 三国令 剑雨江湖 怎样修炼战骑 页游 怎样修炼伙伴 木甲世界 仙侠道2 推黑科技 页游模式 武圣试炼场 街机玩法 蓝月传奇 个人BOSS玩法 哥们网 九阴绝学 仗剑出鞘 全新模式 范伟打天下 全新元神玩法 七大神兵简介 新手攻略 跑腿任务 门派五行 城战礼包 页游界 泥石流 傅园慧 经典网页游戏 耐玩 盘点 玉石攻略 提升角色 大黑 实装属性 神兵攻略 问鼎莽荒 莽荒纪 手持神兵 土豪梦 万世 开学清单 财富赚不停 天书世界 大黑游戏 资源战场 ppwan 天问 激战 全国大战 雄霸一方 新增宠物技能 绝对小能手 花千骨 三尾章鱼 风色轨迹 双枪手 弑之神 缤纷好礼 惊喜六重连 帮会 中秋福利 自制月饼 九阴真经 玩家 五周年纪念 纪念银币 名动三界 新服资料片 画江山 勇战妖魔 邪恶势力 上古降魔 老司机玩法 坐骑揭秘 黑科技 竞技场攻略 铁血皇城 披风玩法 书剑恩仇录 装备强化攻略 野外BOSS玩法 全网曝光 赤壁传说 半回合制国 ACT 奇珍商城 热血战歌 传奇宝藏抽奖 打开方式 门徒 门徒获取玩法 三大萌宠简介