现在我们讨论一个全新的事物:HTML5本地存储。至今,对于本地存储,我们已经有了一些选择。最普遍的莫过于简陋的基cookies的session,但是cookies的存储方法被许多问题所困扰,其中最伤脑筋的是这些。
1、会话中存储的数据在每个请求的过程中都会在客户端和服务器端之间来回传输。
2、存储数据的大小在4KB以内。
3、所有的cookies数据都会过期。
尽管这样,cookies也并非一无是处。cookies可以保存用户的登录状态,以及帮助服务器识别用户的身份。然而,很显然,我们需要另外一种方式来保存数据。幸运的是,在本地储存这个问题上,我们的确拥有一个绝妙的解决方案。它是什么?我很高兴你问了这个问题。
因为有LocalStorage和sessionStorage,我们具备了两套在浏览器中保存文本字符串的javascript API。SessionStorage保存的数据会在用户会话结束后清除(比如浏览器的标签页或者浏览器本身被关闭)而LocalStorage保存的数据则会—直保留下来,直至开发者(通过调用javascript的某些接口 )或用户(通过浏览器的某些设置)决定清除它们。这两个API实质上是相同的,唯一的不同就是它们所保存数据的生存期长短。
在一个现代浏览器(比如最近三年内发布的一个版本 )中打开你的开发人员工具栏,输入localStorage.setitem(“name”,“Ben")。如果在Webkit内核的浏览器中,
你就会在“Resources"标签栏(还需要展幵“Local Storage”)看到我的名字被保存在里面。就在刚刚,你已经保存了你的第一个item到localStorage里了。
现在,让我们用localStorage.getitem来取回刚才保存的东西。你应该看到“Ben”被整齐地打印在console面板中。最后,需要清理这些数据,我们可以用localStorage.deleteitem来删除我的名字或者用LocalStorage.clear()来清除localStorage里面的所有内容。当用户调用LocalStorage.clear()时,其实删除的只是当前域下的数据。因此,如果用户
wwww.jinanwangluo.com下保存了一些数据,当切换到jinanwangluogongsi.com的tab页时,他们会发现并不能获取得到他们在www.jinanwangluo.com的tab页面下保存的数据。