Chrome扩展开发入门 2.怎样使用Chrome Extensions API？

Chrome扩展开发入门 2.怎样使用Chrome Extensions API？

        Google提供的Chrome Extensions API是开发Chrome扩展用到的最权威资料之一，里面详细介绍Chrome扩展所能够实现的各方面的功能和Chrome浏览器所提供的接口（比如怎么调用用户书签）。本文会介绍如何使用Chrome Extensions开发文档。

一个看起来完整的Chrome扩展都有什么？

        额。。好绕的标题。。。其实就是Chrome扩展外观上有哪些部分。。（还是挺绕的。。。）

1、插件栏图标（可选）：

这些图标都是啦～～

2、插件栏弹出页面（可选）

插件栏的图标是可以点击的，左键点击会弹出一个小页面，页面里显示什么完全由开发者控制；右键点击会弹出一个菜单，这并不是Chrome扩展所能够控制的

3、扩展管理页面图标（可选）

在扩展管理页面显示的图标。这个图标和安装插件时显示的图标一致，但和插件栏图标是分开设置的。

如果你没有定义这个图标，扩展安装后就是这个样子。。。

4、选项页面（插件设置页面，可选）

如果你的插件包含一个设置页面，那么在扩展管理页面会看到“选项”链接

5、新标签页

默认你新建一个空白标签时，会显示最近浏览网站和最近关闭的标签

这个页面是可以通过扩展修改的。已经有一些扩展把这个页面改成任务列表、常用网站等形式。

6、针对不同页面而选择性显示的小图标

比如这个图标，可以只在特定页面被载入时显示

扩展栏的图标是不能通过程序控制显示/隐藏的。

以上提到的这些在API文档里就是Browser UI部分

 

Chrome浏览器为扩展提供了那些接口？

1、书签

Chrome扩展可以很容易的取得用户的书签数据，包括书签ID，地址，标题甚至所属目录。也提供添加、修改、删除、搜索的接口。

2、历史记录

Chrome扩展可以添加、删除（全部、按照特定URL等）、搜索用户的历史记录等。

3、浏览器标签页

Chrome扩展可以获取当前用户所打开的标签页、监视标签页状态（被创建、加载中、加载完成、被移除等）、创建标签页、移除标签页。还可以在特定标签页注入CSS（即给页面添加一个新的CSS），执行JS代码（相当于页面里引入一个js文件，可以共享页面JS变量）

4、浏览器窗口

一个窗口可以包含多个标签页。开发者可以创建、移除、更新一个窗口，也可以监视窗口动作（被创建？状态改变？被关闭？）

这些就是API文档里的Browser Interaction部分

我的代码写在哪里？在哪里执行？

前面说道Chrome扩展就是几个网页，那么代码当然就是网页的JavaScript了。Chrome浏览器巧妙的设计了几个特别的网页，开发者可以利用这些网页里的JS代码实现众多功能。

1、后台页面（Background Pages）

后台HTML里的JS在浏览器被打开时就开始执行了，当浏览器关闭时停止工作。你可以在这里写一些代码监视浏览器动作（比如在监视到用户创建了一个新标签页时邪恶的把它关闭^_^）,可以做定时任务（setInterval等），可以添加一段音乐。。。不过这个页面body用户是看不到的。。

2、扩展栏图标的弹出页面

用户点击扩展栏图标时可以弹出一个页面，当用户点击网页部分时这个页面就被关闭了。。这是一个完整的网页，里面可以放视频、动画、功能按钮等。

3、嵌入到网页的JS（Content Scripts）

你可以使用js获取用户当前网页的DOM数据，监听用户键盘、鼠标动作。这些代码是一个独立的JS文件（而不是像后台、弹出窗等是一个HTML文件里的嵌入js代码），通过扩展配置注入到相应的网页。

4、读取用户计算机数据（NPAPI Plugins）

这个功能要用到dll（动态链接库）知识，可以启动用户电脑的程序，删除用户文件等功能。。相当于一个小Windows程序。利用Chrome提供的方法可以让扩展的后台页面与你的dll通信。

这些就API文档里的Implementation部分

自动更新

Autoupdating 部分是告诉你Chrome扩展自动升级的原理