chrome extension 是一个小型的程序，它可以修改并增强 chrome 浏览器的功能。你可以使用 web技术（如 HTML，CSS，JavaScript）来编写。一个扩展就是一个压缩的包，里面有 HTML、CSS、JavaScript、图片或者任何你需要的资源。从本质上来讲，扩展就是一个 web 页面，它也可以使用浏览器为 web 页面提供的 API，如 XMLHttpRequest、JSON、HTML5等。

扩展的用户界面类型

---

扩展的用户界面类型有两种：

• browser action：当你的扩展要操作大多数的网页时，可以使用此类型。
• page action：当你的扩展只操作部分网页时，可以使用此类型。

扩展的目录结构

---

一个扩展通常包含以下文件：

• manifest.json
• HTML 文件
• 可选的 JS 文件
• 可选的其他文件（图片、字体等等）

当你分发（distribute）扩展时，这些内容都会打包进一个后缀是.crx的 ZIP 文件中。

引用文件

在扩展中，你可以使用相对 URL 来引用文件：

![](./images/foo.png)

也可以使用绝对 URL 来引用文件，但这时候需要使用预定义信息 @@extension_id ：

![](chrome-extension://__MSG_@@extension_id__/images/foo.png)

manifest

manifest.json包含着扩展的重要信息，类似package.json。

扩展的架构

---

很多扩展都含有一个包含扩展的主要逻辑的隐形的页面，这个页面就是background page。如果一个扩展要和用户加载的 web 页面进行交互，那么需要使用到content script。

background page

background page 通过background.html来定义，background.html可以包含控制扩展行为的 JS 代码。
background page 可以分为两类：

• persistent background pages：一直打开着
• event pages：按需打开和关闭

content script

如果你需要和浏览器加载的 web 页面交互的话，则需要使用 content script 。content script 在浏览器加载的 web 页面的上下文中运行，可以看成是浏览器加载的 web 页面的一部分。

content script 可以改变当前浏览的 web 页面的内容，但是不能修改扩展的 background page。当然 content script 也没有和扩展完全的分离开，还是可以和扩展交换信息的。

UI pages

在扩展中的 HTML 页面可以访问到其他页面的 DOM，也可以调用其他页面的函数。

chrome.* API

---

扩展除了可以访问浏览器为 web 页面提供的 API，还可以访问 chrome-only API。

存储数据

---

扩展可以使用storageAPI，HTML5 web storage API或者服务器来存储数据。

隐身模式

---

incognito mode保证窗口不会留下任何的痕迹。所以当处理隐身模式下的数据时，尽可能的遵循这一点。

通过相关的tabs.Tab或者window.Window的incognito属性来判断是否处于隐身模式：