Chrome插件开发之二: 添砖加瓦
作者:cmdbuf 发布时间:2010年06月28日
接着上一篇文章《Chrome插件开发之一:搭建基本结构》开始说起,有了基本结构,urlcmt的基本功能已经实现了,接下来需要对插件进行完善和修饰,下面介绍一些基本结构以外的内容。
1. 关于Background.html
popup.html中定义的Javascript变量会在popup.html页面关闭时被释放,那么如何保存一些一直需要使用的变量呢?这就是background.html的作用,background.html页面中定义的javascript变量会在Chrome浏览器生命期中一直存在,可以把需要一直存在的数据保存在这里。
那么我们如何在background.html中保持popup.html页面中的数据呢?可以这么写,先在background.html中定义好变量,例如以下保存用户登录信息的变量
然后在popup.html中用以下方式来引用这些变量,可以改变或者读取变量的值
1 | var bgpg = chrome.extension.getBackgroundPage(); |
2 | bgpg.global_email = "somebody@domain.com" ; |
3 | bgpg.global_passwd = "password" ; |
2. 将数据保存在磁盘
Chrome本身没有提供用于保存变量的值的接口,不过可以通过Javascript操作Cookie保存数据,另外还有一种更加方便的保存数据方式,那就是使用HTML5的localStorage功能保存数据,这也是Chrome插件开发手册中推荐的方式,例如我们希望保存刚才在background.html中定义的用户登录信息,只需要执行以下代码即可
1 | localStorage[ 'email' ] = golbal_email; |
2 | localStorage[ 'passwd' ] = global_passwd; |
这样就算关闭了Chrome浏览器,用户的登录数据还是一样不会丢失,下次启动Chrome浏览器时,只需要执行以下代码就又可以获取这些登录数据了
1 | global_email = localStorage[ 'email' ]; |
2 | global_passwd = localStorage[ 'passwd' ]; |
3. 插件图标右下角的数字
经常可以看见某些插件会在插件图标的右下角显示数字,可以很直观的看到一些信息,还是非常有用的,Chrome插件开发文档称这个数字为badge,可以翻译成徽章的意思。
如果想为自己的Chrome添加这个badge,可以使用以下代码
2 | chrome.browserAction.setBadgeText({text: ‘3’}); |
有了上面介绍的这些功能,插件能提供的服务就又进了一步,好了,今天的分享就到这里,下次再介绍Chrome插件开发的其它内容。