请选择 进入手机版 | 继续访问电脑版
Mozilla

火狐社区

登录    注册

用新浪微博连接 QQ互联

如何将Chrome Extension迁移到Firefox上

yingliu Mozilla员工 发表于 2017-9-20 15:31:49 | 显示全部楼层 [复制链接]
4 5256
本帖最后由 yingliu 于 2017-9-21 13:52 编辑


三年前,为了专心写硕士论文,我写了 FocusBlocker 附加组件。这是一个网站拦截工具,可以阻止我每隔五分钟刷一次 Facebook,但又不像其它的拦截器(如 LeechBlock)那样会让你设置固定的时间。FocusBlocker 的做法是让你设一个额度,例如:我可以先浏览 Facebook 10 分钟,然后封锁 Facebook 信息 50 分钟。只要你还有剩余的限额,随时都可以上 Facebook。我很高兴大家觉得这个工具很好用,我甚至还因为用户满意度很高,而第一次经由 AMO(Mozilla Add-ons)获得用户捐款。

因为这个扩展的功能符合我的需求,所以我没有积极地维护或增加新功能。不过,我知道 Firefox 要以 WebExtension API 取代传统的 Add-on SDK。因此,在 WebExtension API 变成全面可用以前,我便把 FocusBlocker 改成 Chrome 扩展功能的格式,但一时还来不及再把它移植到 Firefox。后来,有用户写信给我,希望我提供 WebExtension 的版本。我查了统计数据后,发现每天的活跃用户数目从 1000 降到 300 左右。那时,我才真正卷起袖子,在一天内把它迁移到 Firefox 上(虽然我后来发现,使用人数下滑不尽然是因为用户升级到新版 Firefox 的缘故,而是因为这个改变)。我在下面分享了我的迁移过程,以及我从中学习到的经验,希望能帮到更多扩展开发者以供参考。

1Yraex1T8E.png

要修改的部分
为了评估工作量,我们必须先看我用了哪些 API。FocusBlocker 的 Chrome 版本主要使用三个 API:
  • chrome.tabs:用来监测新开启的标签页和拦截已开启的标签页
  • chrome.alarm:用来设定封锁和解除封锁的定时器
  • chrome.storage.sync:用来储存设置,以及确保浏览器重启后定时器仍继续计时

很棒的是,Firefox 均支持这三款 API(至少支持我用到的部分),所以,我不必更改任何 JavaScript 程序代码。

我把安装信息文件(manifest)直接上传到 Firefox 的 about:debugging 页(或者你也可使用方便的 web-ext 命令工具),但被 Firefox 拒绝了。

2HzO2yJekM.png

那是因为 Firefox 会要求你为每个扩展设置独特的 ID(但如果你用 web-ext 来执行的话就不需要。你可到此了解更多关于此 ID 设置要求的信息)。还有,你最好(但非必要)设置你的扩展应该在哪个版本以上的 Firefox 运行的要求,如:
  1. "applications": {
  2.   "gecko": {
  3.     "id": "focusblocker@shing.lyu",
  4.     "strict_min_version": "48.0"
  5.   }
  6. },
复制代码

除此以外,还需要再调整一个地方。在 Chrome 扩展上,我用旧的 options_page setting 来设置选项页面(preferencepage),但 Firefox 只支持较新的 options_ui。你还可以把浏览器的系统样式套用到你的选项页面上,让 UI 看起来就像是 Firefox 设置的一部分一样。因为 Firefox 内的命名不是chrome_style,而是更概括性的 browser_style,所以,我需要在 manifest.json 中加入这些东西(以及删除 options_page 的设置):
  1. "options_ui": {
  2.   "page": "options.html",
  3.   "browser_style": true
  4. },
复制代码


3Htw5sAj9.png
4H9F1Wwhk.png

这就是把扩展从 Chrome 迁移到 Firefox 的所有步骤。超级简单吧!Firefox 的 WebExtension 团队真的在扩展兼容性方面做得很好。如果你对以上感兴趣的话,可以到 GitHub 上找到 FocusBlocker 完整的原始代码。

在 AMO 上发布扩展
如果你想让扩展在 addons.mozilla.org 上架的话,你必须把所有文件压缩为 zip 包后上传。下面提供几个可以更快通过审核的秘诀:
  • 如果你在 AMO 上已有旧版的扩展,请上传新的支持 WebExtension API 的扩展,便可取代旧的,以便用户更新成新的扩展(我则是重新登录和上传新扩展,但 AMO 团队并不建议这种做法)
  • 压缩文件内避免加入非必要的文档,特别要记得删除暂存的测试文档
  • 移除或注释掉所有的 console.log() 调用。虽然这不是强制性的要求,但这能让审核过程进行得更顺利
  • 如果你使用到任何第三方的函数库,你可考虑把该文档放在 zip 包中(即所谓的「vendoring」),或至少上传来源以供审核
  • 如果你上传好一个版本后想做些微调或修改,就算是再小的改动,你也需要提升版本号

Firefox 计划随 Firefox 57(Firefox Quantum)的发布(计划于 2017 年 11 月)推出全新的 WebExtension 。如果你有旧版的 Firefox 扩展,或有需要迁移的 Chrome 扩展,现在是最好的时间点。


如果你想尝试新的 FocusBlocker,请到安装页

原文刊出后已修订(2017/8/30):经 Mozilla Add-on 团队的 Andreas 指正,原文已修正,以符合以下原则:



隐元 老狐狸
发表于 2017-9-21 06:35:20 | 显示全部楼层
希望firefox的旧扩展开发者包括Chrome的扩展开发者全部转移到Firefox 57以后的firefox扩展开发上来。
苏林 社区新人
发表于 2017-9-21 09:48:17 | 显示全部楼层
苏林 社区新人
发表于 2017-9-21 09:48:23 | 显示全部楼层
310971373 狐狸精
发表于 2017-9-21 11:12:08 | 显示全部楼层
大小通吃哦,这个一定要打通
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

发新帖
论坛更多 »
热门活动更多 »
  • [免费报名]量子火狐中国社区见面会 Firefox Quantum Fan Meeting[...

    立即参与
火狐微信
快速回复 返回顶部 返回列表