简谈前端存储

cookie

定义:

它会在用户访问服务器的时候被带上。但是不要使用过量,因为cookie在每次请求的时候都会被带上。你总不想每次访问自己网站接口或者文件的时候都带上一堆可能用不到的信息把?这样会增大请求包的大小。

限制:

cookie可以设置访问域。即,如果你设置cookie的时候,设定了cookie的访问域名为一个顶级域名,则可以达到几个子域名共享cookie的效果。

存储时间:

如果设定了cookie的超时时间的话,那么cookie将在到期的时候失效。如果没有设定,那么cookie就是session级别的。cookie的session含义与sessionStorage的session含义有区别。cookie的session是,在未关闭浏览器的情况下,所有的tab级别的页面或新开,或刷新,均属于一个session,也就是说你在一个页面种下cookie然后在打开一个新的页面,会发现新的页面也有cookie,关闭当前tab或者刷新都会存在,但是退出浏览器之后就不在了,证明cookie的session含义是在浏览器退出时才结束。

使用场景:

在存储一些需要随tab附带的信息的时候,最常见的就是用户登录名和密码。存储一些同步访问页面的时候必须要被带到服务端的信息。至于在页面上一些其他操作的信息就没必要存到cookie里了,例如购物车的东西之类的。可以存到数据库里,然后通过cookie的ID进行查询和调取。

sessionStorage

定义:

sessionStorage属于webstorage的一种,sessionStorage与localStorage类似,可以存储k-v形式的数据,通过set便可以存储,通过sessionStorage.getItem进行获取,也就是说sessionStorage,是session级别的存储。其存储于客户端。服务端是无法直接拿到的。

访问限制:

sessionStorage的访问限制更高一些,只有当前设定sessionStorage的域下才能访问,而且不同的两个tab之间不能互通。

存储时间:

是以tab为单位的,伴随着tab存在,如果tab关闭,那么sessionStorage也会随之失效

使用场景:

最经典的就是音乐或者视频播放器恢复进度条

localStorage

定义:

localStorage与sessionStorage较为相似,接口也简单,通过localStorage.setItem/localStorage.getItem即可使用。可以存储k-v形式的数据。存储的值需要是字符串类型,没法直接存储对象,但是可以将对象序列化为字符串再存入。localStorage的存储周期比sessionStorage长,如果用户不清理的话,是可以永久存储的。

var yourName = {
    name: ‘yourName‘,
    describe: ‘阳光、乐观‘
};
localStorage.setItem(‘test‘, JSON.stringify(yourName));
JSON.parse(localStorage.getItem(‘test‘));

访问限制:

Storage虽然相似,但是访问限制却不尽相同,localStorage的访问域默认设定为设置localStorage的当前域,其他域名不可以取。这点与sessionStorage相同,但是与sessionStorage不同的是,localStorage设定后,新开tab是可以访问到的

存储时间:

localStorage理论上讲是永久性质的存储。只要用户不主动清除,那么就会一直存在

大小:

localStorage的大小一般限定为4M左右

使用场景:

由于localStorage的稳定性质,及其长效的存储,可以帮助服务器分担一些压力

注意:  

 IE9 localStorage不支持本地文件,需要将项目署到服务器,才可以支持!

检测方法:

if(window.localStorage){
alert(‘This browser supports localStorage‘);
}else{
alert(‘This browser does NOT support localStorage‘);
}
时间: 2024-10-24 10:46:17

简谈前端存储的相关文章

客户端GUI测试技术和自动化测试架构设计简谈

客户端自动化特点 客户端的自动化,通常做过的人都不是很愿意深入讨论.因为除了功能和逻辑之外,不得不面对各种界面变化,各种和环境交互,各种兼容问题以及想不到灰色地带,就算这样,也找不到太多有效的bug.然而即便如此,客户端的自动化必须去做,尤其是GUI的.它的自动化特点是: 复杂 成本高 不容易发现问题 技术要求高 架构很难通用 下面,从一些基本的东西开始一点点的讨论客户端GUI测试的一些问题和处理办法,以及自动化架构设计的一些思路.事实上就像上面说的,GUI的测试并不是为了发现bug,而是回归的

Linux进程管理简谈

Linux系统进程管理简谈 进程是什么? 简单来说进程是一个正在执行的程序的一个副本,存在生命周期,有段指令和代码在不断运行. linux内核存储信息的固定格式:task struct 进程的相关信息存储在链表中 多个任务的task struct组件的链表:task list 进程的创建:父进程创建子进程(内核创建init进程,剩余一切进程有init及其子进程进程创建) 父进程创建子进程时向内核调用fork()来创建子进程并且通过调用clone()复制父进程的信息给子进程 Linux进程的优先级

浅谈前端性能优化(移动端)

上一篇讲了PC端的部分:前端性能优化(PC端),这次继续说移动端的.相对于PC端的,移动web浏览器上有一些明显的特点:设备的屏幕小.新特性兼容性较好.支持一些比较新的HTML5和CSS3.需要与Native应用交互等.但移动端可用的CPU资源和网络资源极为有限,因此要做好移动端web上的优化往往需要考虑做更多的事情.首先在移动web的前端页面渲染中,PC的优化规则同样适用,此外针对浏览器也要做一些更细节的优化达到更好的效果.需要注意的是,并不是移动端的优化在PC端不适用,而是由于兼容性的原因,

浅谈密码存储安全

前言 用户信息泄露事件层出不穷,百度或谷歌输入"密码泄露",搜出来的泄密门更是让人目瞪口呆:从小公司到大公司,从明文存储到普通的哈希加密.作为一个IT从业者,我深刻感受到"得用户者得天下",尤其在互联网+盛行的趋势下.密码存储作为软件服务系统基础架构中不可缺少的一部分,越来越多的受到开发者的重视.对于一个服务,如果信息安全部分出问题,我想没有必要进一步去做用户体验的提升,性能的优化.进而也不可能获取大用户的青睐.还是那句话:出来混,迟早要还的. 本人并非密码学出生,

.NET简谈事务、分布式事务处理

在本人的 " .NET简谈事务本质论"一文中我们从整体上了解了事务模型,在我们脑子里能有一个全局的事务处理结构,消除对数据库事务的依赖理解,重新认识事务编程模型. 今天这篇文章我们将使用.NET C#来进行事务性编程,从浅显.简单的本地事务开始,也就是我们用的最多的ADO.NET事务处理,然后我们逐渐扩大事务处理范围,包括对分布式事务处理的使用,多线程事务处理的使用. 数据库事务处理 数据库事务处理我们基本都很熟悉了,begin Transaction --end Transactio

简谈【自动化协议逆向工程技术的当前趋势】

声明: 1)本文由我bitpeach原创撰写,禁止一切形式的转载.如有转载,侵权必究. 2)本简谈主要分为三个方面,第一是自动化协议逆向技术的基本理论,第二是当前发展趋势,第三是入门协议逆向技术的必备过程. 3)既是简谈,则文章篇幅不长,同时本文观点不一定正确,希望抛砖引玉,能得高人指点,幸为殊荣. 4)最近一个月比较忙,昨天正好写完稿子,今天就简写一些内容,避免重复,故为简谈. (一)协议逆向工程理论基础 1.1 什么是协议逆向技术 协议逆向工程是指在不依赖于协议描述的情况下,通过对协议实体的

[简谈]绕过HR破门而入的求职智慧

以往我们在网上看到的很多求职文章或指导性纲领,譬如啥自信.做功课.良好形象.华丽的简历.工作经验.口才啥的,其实到了21世纪尤其是互联网高速发展的今天,前面这些技巧就显得无比空洞: 1.因为自信谁都可以做到哪怕装都能装出来 2.简历,谁都可以用各种模板来打造,至于说HR们是否看到华丽的简历就立刻对你打100分这也是有扯淡嫌疑的 3.良好形象.一般来说主要是衣着得体.气质不俗,长得好看不好看已经不怎么重要了,长得好看只能说明你大学时期课外生活也许很丰富,长得不好看也不代表你一定是个很努力的人 4.

[聊一聊系列]聊一聊前端存储那些事儿

https://segmentfault.com/a/1190000005927232 欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码):https://segmentfault.com/blog/frontenddriver 在web开发越来越复杂的今天,前端拥有的能力也越来越多.其中最重要的一项莫过于web存储.开发者们如果使用得当,这些存储可以帮助我们提升网页的性能与灵活度.本文不讲个中的细节,只讲各种前端存储的利弊,与各类存储的应用场景.毕竟

简谈WP,IOS,Android智能手机OS

什么是智能手机? 相信到现在这个已经是傻瓜到不能再傻瓜的问题了 智能手机都不懂? 那你活着还有什么意思= = 但是为了谈论今天的三大主角:wp,ios,android 不得不回答一下这个笨笨的问题 如果没记错的话,我在高中的时候获得了我的第一把智能手机 没错,就是那时候火到爆的Nokia6120c 相信对小6,大家都不陌生 感觉那时候是人手一把的神器啊 小巧好用不说,竟然还能后台挂qq!(= =那时候确实很惊讶,竟然能在多个软件切来切去的) 在加上Nokia砖头之名 神机当之无愧啊,当时不知道羡