Chrome 扩展开发，定制多功能框(omnibox)

原来一直想着用完整的 Web 应用或 GUI 来做些增强效率的工具集，其实我们每天打交道的浏览器，进行下扩展就能好好的利用。粗略对比了下 Chrome 和 Firefox 的插件系统，Chrome 的插件开发应该要比 Firefox 的简单，无需引用什么新的概念，像 XUL。

例如，想实现一下 omnibox，即 Chrome 的全功能框(地址栏)，想要地址栏进入自定的 Unmi 模式，输入关键字让 google 去本站查询，或是输入 tag, category 直接进入本站的相关 tag, category 日志列表，在当前浏览器的 Tab 中打开目的页面。

比如在地址栏上输入关键字 "u>", 然后按空格或 Tab 键就进入到 Unmi 模式，如图

下面是完整开发步骤

1. 建立一个目录，如 unmi, 这样 Chrome 开发模式下才好从这个目录中加载插件

2. 每个 Chrome 插件都有的清单文件 manifest.json，这里的内容是

manifest.json 的帮助请看 Manifest File Format 页面。上面是本项目的基本配置，配说明。

3. 实现 background.js，相关 API 说明见 chrome.omnibox

4. Chrome 中引入新开发的插件

在 Chrome 里，Window->Extensions, 或地址栏中输入 chrome://extensions 进入 Chrome 的扩展配置页面，选择开发模式，就可以点击 "Load unpacked extension..." 按钮，选择目录来导入刚开发的插件。Pack extension... 用来打包你的扩展。

加载后是这样的

看到插件名, 版本，从哪个目录加载的，Chrome 为该插件生成的 ID。

开发到有修改源代码，可点击 Reload 按钮重新载入，有时候会自动载入最新的代码。上面的 background page 是调试用的，比如执行代码时有什么错误能够在这个 background page 中显示出来

至此一个完整的插件宣告完成，效果就是本文第一个图片所示

地址栏输入  u> 空格或Tab，进入 Unmi 模式
输入 play，打开页面 https://www.google.com/search?q=play+site%3Aunmi.cc
输入 tag=play，打开页面 http://yanbin.blog/tag/play/
输入 category=scala，打开页面  http://yanbin.blog/category/scala/

续：我们可以创建新的 Tab 来打开页面，如

在360 网站上有翻译的 Chrome 扩展开发文档，官方开发文档入口 https://developer.chrome.com/extensions。

备：Chrome 的插件和扩展是同一个概念，本文同时使用了这两个词。