Chrome浏览器扩展开发系列之八：Chrome扩展的数据存储

Google Chrome浏览器扩展可以使用如下任何一种存储机制：

• HTML5的localStorage API实现的本地存储（此处略）
• Google的chrome.storage.* API实现的浏览器存储
• Google的chrome.cookies.* API实现的cookie存储

 

1) chrome.storage API实现的浏览器存储

Chrome浏览器扩展通过chrome.storage.* API，可以存取数据或监听数据的变化。

在manifest.json文件中注册storage如下：

      {

        "permissions": [

          "storage"

        ],

      }

chrome.storage.* API提供了chrome.storage.sync， chrome.storage.local和chrome.storage.managed三种存储空间类型。chrome.storage.local方式只能够将数据存储在当前登录的设备本地。

chrome.storage.sync方式实现了自动数据同步，相同的用户无论使用什么物理设备，只要以相同的账户登录即可访问存储的数据。设备离线时数据存储在本地，一旦设备上线则同步数据。如果用户禁止了数据同步，则采用chrome.storage.local方式。

chrome.storage.managed方式是只读存储，只有域管理员能够在其中存储数据，Chrome浏览器扩展只能读取其中的数据。

chrome.storage机制采用一系列的存储格子（tubes）存储数据，存储空间有限。存储数据时只能一个一进行写入操作，并发性能不高。

下面以chrome.storage.sync为例介绍具体方法的使用：

• 存储一个或多个数据

chrome.storage.sync.set(object items, function() {...})

其中的items对象包含若干“键值对”的映射，一个键值对就是一个存储的数据项。

• 获取指定key的数据项

chrome.storage.sync.get(string or array of string or object keys, function(object items) {...})

其中的keys如果为null则返回全部存储的数据项，如果为””或[]将返回空对象{}。

回调函数中的items对象就是获取的数据项，其中包含“键值对”的映射。

• 删除指定key的一个或多个数据项

chrome.storage.sync.remove(string or array of string keys, function() {...})

• 清空存储的所有数据项

chrome.storage.sync.clear(function(){…})

• 获取当前已经被使用的存储空间的数量（以字节为单位）

chrome.storage.sync.getBytesInUse(string or array of string keys, function(integer bytesInUse) {...})

其中的keys属性是数据项的key，如果为null表示取全部数据项的使用空间，””或[]将返回0

此外，对于某些敏感数据的变化，可以通过onChanged事件进行监听。存储格子中的任何变化都将触发该事件，示例如下：

chrome.storage.onChanged.addListener(function(changes, namespace) {

for (key in changes) {

var storageChange = changes[key];

console.log('Storage key "%s" in namespace "%s" changed. ' +

'Old value was "%s", new value is "%s".',

key, //数据的索引key

namespace, //数据的存储空间类型，枚举值"sync", "local", "managed"

storageChange.oldValue,//变化前的值

storageChange.newValue); //变化后的值

}

});

回调函数中的changes对象包含了所有发生变化了的数据的key（string类型）和变化前后的值（StoreageChange类型），数据结构如下：

changes:{

  key1: obj

  key2: obj2

  …

  keyn: objn

}

 

2) chrome.cookies.* API实现的cookie存储

Chrome浏览器扩展通过chrome.cookies.* API，可以获取或修改cookie，还可以监控cookie的变化。

在manifest.json文件中声明cookie权限以及要访问的域如下：

{

"permissions": [

"cookies",

"*://*.google.com"

],

}

chrome.cookies.Cookie对象的属性如下：

属性名	类型	必选/可选	注释
name	string	必选	Cookie对象的名字
value	string	必选	Cookie对象的值
domain	string	必选	Cookie对象适用的域
path	string	必选	Cookie对象适用的URL路径
hostOnly	boolean	必选	Cookie对象是否只响应指定主机的请求，访问Cookie对象的请求的主机必须在指定范围内
secure	boolean	必选	Cookie对象是否被标记为Secure，这样就只能通过安全通道（如HTTPS）访问Cookie对象
httpOnly	boolean	必选	Cookie对象是否被标记为HttpOnly，这样客户端脚本就无法访问Cookie对象
session	boolean	必选	是否为Session级别的Cookie对象
expirationDate	double	可选	Cookie对象的过期时间，单位s Session级别的Cookie对象没有该属性，因为会话结束即过期
storeId	string	必选	包含该Cookie对象的CookieStore的ID

其中，chrome.cookies.CookieStore对象表示浏览器中的cookie仓库，常见的有正常模式的CookieStore和隐身模式的CookieStore。

chrome.cookies API中的常用方法：

• 获得一个Cookie对象，如果有多个符合过滤条件则返回拥有最长path的Cookie对象

chrome.cookies.get(object details, function(Cookie cookie) {...})

details对象的属性如下：

属性名	类型	必选/可选	注释
url	string	必选	访问Cookie对象的请求的URL
name	string	必选	Cookie对象的名字
storeId	string	可选	包含该Cookie对象的CookieStore的ID，默认为当前执行的上下文的CookieStore

• 获取一个CookieStore中的所有的Cookie对象

chrome.cookies.getAll(object details, function(array of Cookie cookies) {...})

details对象的属性如下：

属性名	类型	必选/可选	注释
url	string	可选	访问Cookie对象的请求的URI，影响domain和path
name	string	可选	Cookie对象的名字
value	string	可选	Cookie对象的值
domain	string	可选	Cookie对象适用的域
path	string	可选	Cookie对象适用的URL路径
secure	boolean	可选	Cookie对象是否被标记为Secure，这样就只能通过安全通道（如HTTPS）访问Cookie对象
session	boolean	可选	是否为Session级别的Cookie对象
storeId	string	可选	包含该Cookie对象的CookieStore的ID

• 设置Cookie对象

chrome.cookies.set(object details, function(Cookie cookie) {...})

details对象的属性如下：

属性名	类型	必选/可选	注释
url	string	必选	访问Cookie对象的请求的URI，影响domain和path
name	string	可选	Cookie对象的名字
value	string	可选	Cookie对象的值
domain	string	可选	Cookie对象适用的域
path	string	可选	Cookie对象适用的URL路径
secure	boolean	可选	Cookie对象是否被标记为Secure，这样就只能通过安全通道（如HTTPS）访问Cookie对象
httpOnly	boolean	可选	Cookie对象是否被标记为HttpOnly，这样客户端脚本就无法访问Cookie对象
expirationDate	double	可选	Cookie对象的过期时间，单位s Session级别的Cookie对象没有该属性，因为会话结束即过期
storeId	string	可选	包含该Cookie对象的CookieStore的ID

• 根据名字删除Cookie对象

chrome.cookies.remove(object details, function(object details) {...})

details对象的属性如下：

属性名	类型	注释
url	string	要删除的Cookie对象所关联的URL
name	string	要删除的Cookie对象的名字
storeId	string	要删除的Cookie对象的CookieStore的ID

• 获取所有的cookie仓库对象

chrome.cookies.getAllCookieStores(function(array of CookieStore cookieStores) {...})

• 监听Cookie对象的变化

chrome.cookies.onChanged.addListener(function(object changeInfo) {...})

如果Cookie对象的值被修改或删除，则发出该事件。changeInfo对象的属性如下：

属性名	类型	注释
removed	boolean	Cookie对象是否被删除
cookie	chrome.cookies.Cookie	发生变化的Cookie对象
cause	chrome.cookies.OnChangedCause	导致Cookie对象变化的原因