cookie与本地存储

cookie也叫HTTP Cookie,最初是客户端与服务器端进行会话使用的

document.cookie = "username = xiaoming";(创建cookie的方式)


cookie由名/值对形式的文本组成:name=value。完整格式为:

name=value; [expires=date]; [path=path]; [domain=somewhere.com]; [secure]

中括号是可选,name=value是必选。

document.cookie = 'user=xiaoming'//写入

alert(document.cookie); //读取


2:创建cookie后的过期时间Cookie虽然在持久保存客户端用户数据提供了方便,分担了服务器存储的负担。但是还有很多局限性的。

第一:每个特定的域名下最多生成20个cookie(根据不同的浏览器有所区别)。

1.IE6或更低版本最多20个cookie

2.IE7和之后的版本最多可以50个cookie。IE7最初也只能20个,之后因被升级不定后增加了。

3.Firefox最多50个cookie

4.Opera最多30个cookie

5.Safari和Chrome没有做硬性限制。

为了更好的兼容性,所以按照最低的要求来,也就是最多不得超过20个cookie。当超过指定的 cookie时,浏览器会清理掉早期的cookie。IE和Opera会清理近期最少使用的cookie,Firefox会随机清理cookie。

第二:cookie的最大大约为4096字节(4k),为了更好的兼容性,一般不能超过4095字节即可。

第三:cookie存储在客户端的文本文件,所以特别重要和敏感的数据是不建议保存在cookie的。比如银行卡号,用户密码等

第四: cookie 会把数据发送到服务端  有些会造成不必要的带宽浪费

cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。

Cookie通过在客户端记录信息确定用户身份,Session通过在服务器端记录信息确定用户身份。`

var d = new Date();

// d.setDate(d.getDate() + 3);

d.setMinutes(d.getMinutes() + 1);

document.cookie = "user = Jack;expires = " + d;

//3:创建cookie

function setCookie(name,value,day){

var cookieText = name + "=" + value;

if(day > 0){

var d = new Date();

d.setDate(d.getDate() + day);

cookieText = cookieText + ";expires= " + d;

}

document.cookie = cookieText;

}

setCookie("a","Rose",1);

setCookie("bbb","Jack",1);

setCookie("c","xiaoming",1);

document.write(document.cookie)

// alert(document.cookie.substring(2));

// var str = "c";

// var s = document.cookie.indexOf(str + "=");//8

// var e = document.cookie.indexOf(";",s);//14

// var start = s + str.length + 1;

// alert(document.cookie.substring(start,e))

// a=Rose

// substring(2)

// substr(2,4)

//获取

function getCookie(name){

var start,end;

if(document.cookie.indexOf(name + "=") != -1){

start = document.cookie.indexOf(name + "=");

end = document.cookie.indexOf(";",start);

if(end == -1){

end = document.cookie.length;

}

return document.cookie.substring(start + name.length + 1,end);

}

}

// alert(getCookie("a"));

// alert(getCookie("bbb"));

// alert(getCookie("c"));

删除cookie

function unsetCookie(name){

document.cookie = name + "=;expires = " + new Date(0);

}

unsetCookie("a");

//设置cookie

function setCookie(name,value,day){

var cookieText = name + "=" + value;

if(day > 0){

var d = new Date();

d.setDate(d.getDate() + day);

cookieText += ";expires = " + d;

}

document.cookie = cookieText;

}

//获取cookie

function getCookie(name){

var start,end;

if(document.cookie.indexOf(name + "=") != -1){

start = document.cookie.indexOf(name + "=");

end = document.cookie.indexOf(";",start);

if(end == -1){

end = document.cookie.length;

}

return document.cookie.substring(start + name.length + 1 , end);

}

}

var u = getCookie("username");

var newu;

if(u != "" && u != null){

alert("欢迎你回来,亲爱的" + u);

}else{

newu = prompt("请输入你的用户名");

if(newu != null && newu != ""){

setCookie("username",newu,1);

}

}

本地存储

localStorage.setItem("username","xiaoming");

//本地存储第一种设置方式

// localStore.setItem(key,value)

//本地存储第二种设置方式

// localStorage.属性名 = 属性值;

localStorage.book = "piao";

localStorage.a = "xiaohuang";

// alert(localStorage.book);

// alert(localStorage.username);

// 获取本地存储

// 第一种方式:

// localStorage.属性名

// 第二种方式:

删除

// localStorage.getItem("属性名")

// alert(localStorage.getItem("username"))

localStorage.removeItem("username")

//删除所有的存储信息(清空所有信息)

localStorage.clear();

应用缓存

manifest="demo.appcache"

cookie由名/值对形式的文本组成:name=value。完整格式为:

name=value; [expires=date]; [path=path]; [domain=somewhere.com]; [secure]

中括号是可选,name=value是必选。

document.cookie = 'user=xiaoming'//写入

alert(document.cookie); //读取

cookie由名/值对形式的文本组成:name=value。完整格式为:

name=value; [expires=date]; [path=path]; [domain=somewhere.com]; [secure]

中括号是可选,name=value是必选。

document.cookie = 'user=xiaoming'//写入

alert(document.cookie); //读取

cookie由名/值对形式的文本组成:name=value。完整格式为:

name=value; [expires=date]; [path=path]; [domain=somewhere.com]; [secure]

中括号是可选,name=value是必选。

document.cookie = 'user=xiaoming'//写入

alert(document.cookie); //读取

Cookie虽然在持久保存客户端用户数据提供了方便,分担了服务器存储的负担。但是还有很多局限性的。

第一:每个特定的域名下最多生成20个cookie(根据不同的浏览器有所区别)。

1.IE6或更低版本最多20个cookie

2.IE7和之后的版本最多可以50个cookie。IE7最初也只能20个,之后因被升级不定后增加了。

3.Firefox最多50个cookie

4.Opera最多30个cookie

5.Safari和Chrome没有做硬性限制。

为了更好的兼容性,所以按照最低的要求来,也就是最多不得超过20个cookie。当超过指定的 cookie时,浏览器会清理掉早期的cookie。IE和Opera会清理近期最少使用的cookie,Firefox会随机清理cookie。

第二:cookie的最大大约为4096字节(4k),为了更好的兼容性,一般不能超过4095字节即可。

第三:cookie存储在客户端的文本文件,所以特别重要和敏感的数据是不建议保存在cookie的。比如银行卡号,用户密码等

第四: cookie 会把数据发送到服务端  有些会造成不必要的带宽浪费

cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。

Cookie通过在客户端记录信息确定用户身份,Session通过在服务器端记录信息确定用户身份。`

Cookie虽然在持久保存客户端用户数据提供了方便,分担了服务器存储的负担。但是还有很多局限性的。

第一:每个特定的域名下最多生成20个cookie(根据不同的浏览器有所区别)。

1.IE6或更低版本最多20个cookie

2.IE7和之后的版本最多可以50个cookie。IE7最初也只能20个,之后因被升级不定后增加了。

3.Firefox最多50个cookie

4.Opera最多30个cookie

5.Safari和Chrome没有做硬性限制。

为了更好的兼容性,所以按照最低的要求来,也就是最多不得超过20个cookie。当超过指定的 cookie时,浏览器会清理掉早期的cookie。IE和Opera会清理近期最少使用的cookie,Firefox会随机清理cookie。

第二:cookie的最大大约为4096字节(4k),为了更好的兼容性,一般不能超过4095字节即可。

第三:cookie存储在客户端的文本文件,所以特别重要和敏感的数据是不建议保存在cookie的。比如银行卡号,用户密码等

第四: cookie 会把数据发送到服务端  有些会造成不必要的带宽浪费

cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。

Cookie通过在客户端记录信息确定用户身份,Session通过在服务器端记录信息确定用户身份。

cookie 和session 的区别:`

1、cookie数据存放在客户的浏览器上,session数据放在服务器上。

2、cookie不是很安全,别人可以分析存放在本地的COOKIE并进行COOKIE欺骗

考虑到安全应当使用session。

3、session会在一定时间内保存在服务器上。当访问增多,会比较占用你服务器的性能

考虑到减轻服务器性能方面,应当使用COOKIE。

4、单个cookie保存的数据不能超过4K,很多浏览器都限制一个站点最多保存20个cookie。

5、所以个人建议:

将登陆信息等重要信息存放为SESSION

其他信息如果需要保留,可以放在COOKIE中

sessionStorage: session即会话的意思,在这里的session是指用户浏览某个网站时,从进入网站到关闭网站这个时间段,session对象的有效期就只有这么长。

sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。

localStorage: 将数据保存在客户端硬件设备上,不管它是什么,意思就是下次打开计算机时候数据还在。

localStorage 方法存储的数据没有时间限制。第二天、第二周或下一年之后,数据依然可用。

两者区别就是一个作为临时保存,一个长期保存。

应用程序缓存为应用带来三个优势:

离线浏览 - 用户可在应用离线时使用它们

速度 - 已缓存资源加载得更快

减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。

设置服务器识别appcache文件

扩展名:.appcache    类型:cache manifest  cache:6  需要加载的文件(如js/css/jpg文件等)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,847评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,208评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,587评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,942评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,332评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,587评论 1 218
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,853评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,568评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,273评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,542评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,033评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,373评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,031评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,073评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,830评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,628评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,537评论 2 269

推荐阅读更多精彩内容

  • 1、cookie 2、localStorage 3、 touch.js插件的使用使用方法请戳:http://tou...
    吹蒲公英的猫阅读 236评论 0 0
  • 什么是 Cookie “cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就...
    恩德_b0c2阅读 375评论 0 3
  • cookie也叫HTTP Cookie,最初是客户端与服务器端进行会话使用的。比如,会员登录,下次回访网站时无须登...
    lovelydong阅读 375评论 0 1
  • 《ijs》速成开发手册3.0 官方用户交流:iApp开发交流(1) 239547050iApp开发交流(2) 10...
    叶染柒丶阅读 4,740评论 0 7
  • 背景在HTTP协议的定义中,采用了一种机制来记录客户端和服务器端交互的信息,这种机制被称为cookie,cooki...
    时芥蓝阅读 2,322评论 1 17