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对象变化的原因

Chrome浏览器扩展开发系列之八:Chrome扩展的数据存储的更多相关文章

  1. Chrome浏览器扩展开发系列之十四

    Chrome浏览器扩展开发系列之十四:本地消息机制Native messaging 时间:2015-10-08 16:17:59      阅读:1361      评论:0      收藏:0    ...

  2. Chrome浏览器扩展开发系列之十四:本地消息机制Native messagin

    Chrome浏览器扩展开发系列之十四:本地消息机制Native messaging 2016-11-24 09:36 114人阅读 评论(0) 收藏 举报  分类: PPAPI(27)  通过将浏览器 ...

  3. Chrome浏览器扩展开发系列之十六:扩展中可用的Chrome浏览器API

    除了Chrome浏览器支持的chrome.* API之外,Chrome浏览器扩展还可以使用Chrome浏览器为Web页面或Chrome app提供的APIs.对于Chrome浏览器2支持的API,还可 ...

  4. Chrome浏览器扩展开发系列之一:初识Google Chrome扩展

    1.       Google Chrome扩展简介 Google Chrome扩展是一种软件,以增强Chrome浏览器的功能. Google Chrome扩展使用HTML.JavaScript.CS ...

  5. Chrome扩展开发之二——Chrome扩展中脚本的运行机制和通信方式

    目录: 0.Chrome扩展开发(Gmail附件管理助手)系列之〇——概述 1.Chrome扩展开发之一——Chrome扩展的文件结构 2.Chrome扩展开发之二——Chrome扩展中脚本的运行机制 ...

  6. EXT.NET高效开发(三)——使用Chrome浏览器的开发人员工具

    这篇帖子老少皆宜,不分男女,不分种族,不分职业.俗话说:“磨刀不误砍柴工”.掌握一些开发工具的使用,对自己帮助是很大的(无论是用于分析问题,还是提高生产力).本篇就讲述如何利用Chrome浏览器(这里 ...

  7. Spring Boot干货系列:(八)数据存储篇-SQL关系型数据库之JdbcTemplate的使用

    Spring Boot干货系列:(八)数据存储篇-SQL关系型数据库之JdbcTemplate的使用 原创 2017-04-13 嘟嘟MD 嘟爷java超神学堂 前言 前面几章介绍了一些基础,但都是静 ...

  8. Node.js 从零开发 web server博客项目[数据存储]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  9. Chrome浏览器扩展开发系列之十九:扩展开发示例

    翻译总结了这么多的官网内容,下面以一款博主开发的“沪深股票价格变化实时追踪提醒”软件为例,介绍Chrome浏览器扩展程序的开发,开发环境为Eclipse IDE+Chrome Browser. “沪深 ...

随机推荐

  1. KeepAlive随笔

    参数说明 :  1 . SocketTimeout               // 响应超时时间,超过此时间不再读取响应  2 . ConnectTimeout    // 链接建立的超时时间  3 ...

  2. 浅析Web缓存

    在前端开发中,性能一直都是被大家所重视的一点,然而判断一个网站的性能最直观的就是看网页打开的速度.其中提高网页反应速度的一个方式就是使用缓存.一个优秀的缓存策略可以缩短网页请求资源的距离,减少延迟,并 ...

  3. TWaver 2D+GIS+3D的试用和在线Demo

    TWaver 2D for HTML5试用下载: http://download.servasoft.com/dl/twaver/sssyuwyeriUR/k/twaver-html5-5.4.7.z ...

  4. Submin1安装记录(CentOS5)

    安装SVN和Apache wget http://opensource.wandisco.com/RPM-GPG-KEY-WANdisco -O /tmp/RPM-GPG-KEY-WANdisco & ...

  5. Vue2.x中的Render函数

    Render函数是Vue2.x版本新增的一个函数:使用虚拟dom来渲染节点提升性能,因为它是基于JavaScript计算.通过使用createElement(h)来创建dom节点.createElem ...

  6. 总结常见的ES6新语法特性。

    前言 ES6是即将到来的新版本JavaScript语言的标准,他给我们带来了更"甜"的语法糖(一种语法,使得语言更容易理解和更具有可读性,也让我们编写代码更加简单快捷),如箭头函数 ...

  7. storm定时任务【tick】

    一. 简介      storm作为流计算,处理数据通常以数据驱动.即只有当spout发射数据才会进行计算.那么如果想要做定时任务如何处理哪,例如有的bolt需要输出一段时间统计的结果,这里一段时间可 ...

  8. typecho for SAE

    url:http://cloudbbs.org/forum.php?mod=viewthread&tid=22817 typecho和wordpress差不多,目前使用的用户非常之多.这里分享 ...

  9. 读Zepto源码之样式操作

    这篇依然是跟 dom 相关的方法,侧重点是操作样式的方法. 读Zepto源码系列文章已经放到了github上,欢迎star: reading-zepto 源码版本 本文阅读的源码为 zepto1.2. ...

  10. Vue2.0 从零开始--搭建环境

    简要:继项目空闲后,开始着手vue的学习;为此向大家分享其中的艰辛和搭建办法,希望能够跟各位VUE大神学习探索,如果有不对或者好的建议告知下:*~*! 一.什么是VUE? 是一种node.js框架,特 ...