1. cookie:存储大小4k 有时间限制,会跟在ajax的请求头上
2. localStorage: 存储大小5M 没有时间限制
3. sessionStorage: 临时会话存储 当浏览器关闭的时候信息自动销毁
注:以上三种都是属于客户端的,传输类型为字符串
服务端==>session:后端的cookie 安全性相比较前三个来说 安全性特别高:https://blog.csdn.net/qq_27965129/article/details/53140755
cookie,localStoraga,sessionStorage 都遵循同源策略
cookie是由服务器设置的,当你发送ajax的时候,无论你是否想要发送cookie,它都会跟在请求头那里。

cookie会话跟踪技术(不存密码)
 
会话,你在浏览器进行操作,这样的行为叫做会话
 
会话结束:关闭浏览器
 
回话跟踪技术:通过一系列的操作,确定用户,记录用户的行为;
 
cookie是服务器写在客户端
 
当你打开第一个新页面时,服务端会判断你当前页面是否有cookie。
 
cookie过期时间默认为会话结束时间,如果设置时间,则到时间后过期。
 
1.设置cookie;
document.cookie = 'name=guoqian';
 
 
document.cookie = 'age=24';
document.cookie = 'address=hunan';
document.cookie = 'user='+encodeURIComponent('张三;'); 
2.封装的cookie;
setCookie('teacher','28');
 
function setCookie(_name,value,day){
 
//var data = new Date();
 
//data.setDate(data.getData()+day)
 
var data = Date.now();
 
data =new Data(data +=day *24*60*60*1000);
 
expires = "expires="+data;
 
document.cookie = ` ${key}=>${value;}${expires} `;
 
}
 
1.获取cookie的方法 
function getcookie(){
 
var arr = docment.cookie.split(";");
 
}
 
 
 
2.获取指定cookie
 
function getCookie(_name){
 
var str = docment.cookie;
 
var arr = str.split(;);
 
var len = arr.length;
 
for(var i=0;i<len;i++){
 
var newarr = arr[i].split('=');
 
if( newarr[0] ==name){
 
return newarr[1]
 
 
} }
 
 
 
 3.删除cookie
 
function removeCookie(_name,_val){
 
 setCookie(_name,_val,-1);
 
}
本地存储 :localStorage()和sessionStorage()
一、localStorage() =》页面传值大,数据量大,不人为清除的话,生命永久,不会清除
 
1.创建localStorage 
 
localStorage.getItem("name");
 
localStorage.setItem("name","张三");
 
localStorage.age = 19;
 
localStorage["sex"] = "男";
 
 //var obj = [{id:0,num:1},{id:1,num:2}];
 //localStorage.setItem("init",JSON.stringify(obj))
 console.log(localStorage.getItem("name"))
 console.log(localStorage.age)
 console.log(localStorage["sex"])
2.删除localStorage 
 
localStorage.removeItem("name")
localStorage.clear()
 
 
3.循环查看localSrorage 
 
for(var i=0;i<localStorage.length;i++){
var _name = localStorage.key(i);
console.log(localStorage.getItem(_name))
}
 
 
 二、sessionStorage: 临时会话存储。 当页面关闭的时候信息自动销毁,只作用于当前窗口,不会作用于其他的窗口。
 
sessionStorage.setIem("key","value");
sessionStorage.clear//清除
 

cookie 和 localStorage 、sessionStorage、 session不同的更多相关文章

  1. js中cookie,localStorage(sessionStorage)的存取

    一.cookie (原生的不好用,自己简单封装) 1. 存cookie的方法: function setCookie(c_name,value,expiredays) { var exdate=new ...

  2. cookie和localstorage sessionStorage的概念、区别、使用场景

    本文分为三大板块: 1 webStorage的概念 2 cookie/localStorage/sessionStorage的介绍 3 三者之间的共同点和区别 **所有代码引用均来自 作者:OBKor ...

  3. 前端 JS,localStorage/sessionStorage、cookie 及 url 等实现前台数据共享、传输

    需求是这样的:需要统计用户公司某款产品用户的回馈情况,美工给的设计多个psd,每个页面里面都有一个选择题,让用户选择自己的答案,最后经过几次选择之后在最后一个页面统一提交到后台!所以这里引出的技术需求 ...

  4. 简单说下cookie,LocalStorage与SessionStorage.md

    最近在网上看到有人讨论这三个的一些概念与区别,发现自己也一直没有较好的总结,所以查阅了一些资料来阐述一下. 基本概念 cookie cookie英文意思是小甜饼,是原来的网景公司创造,目前是在客户端存 ...

  5. 本地存储localStorage sessionStorage 以及 session 和cookie的对比和使用

    cookie和session都是用来跟踪浏览器用户身份的会话方式. 1.验证当前服务中继续请求数据时,哪些缓存数据会随着发往服务器? 只有cookie中设置的缓存数据会发送到服务器端 2. 强调几点: ...

  6. 本地存储常用方式 localStorage, sessionStorage,cookie 的区别 和 服务器存储session

    本地存储:把一些信息存储到客户端本地(主要目的有很多,其中有一个就是实现多页面之间的信息共享)       1. 离线缓存(xxx.manifest)  H5处理离线缓存还是存在一些硬伤的,所以真实项 ...

  7. localStorage sessionStorage 和cookie等前端存储方式总结

    localStorage sessionStorage 和cookie localStorage localStorage是本地存储的,除非清空本地数据 localStorage不会自动把数据发给服务 ...

  8. JS 详解 Cookie、 LocalStorage 与 SessionStorage

    基本概念 Cookie Cookie 是小甜饼的意思.顾名思义,cookie 确实非常小,它的大小限制为4KB左右.它的主要用途有保存登录信息,比如你登录某个网站市场可以看到"记住密码&qu ...

  9. Cookie、LocalStorage 与 SessionStorage的区别在哪里?

    基本概念 Cookie Cookie 是小甜饼的意思.顾名思义,cookie 确实非常小,它的大小限制为4KB左右.它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记住密码”,这通常就是通 ...

  10. [JavaScript] Cookie,localStorage,sessionStorage概述

    Cookie Cookie 是一些数据, 存储于你电脑上的文本文件中,当 web 服务器向浏览器发送 web 页面时,在连接关闭后,服务端不会记录用户的信息.Cookie 的作用就是存储 web 页面 ...

随机推荐

  1. Exadata Adaptive Scrubbing Schedule

    1.为什么要引入"Hard Disk Scrub and Repair"特性 在exadata的11.2.3.3.0版本中,开始引进了"Automatic Hard Di ...

  2. vue框架学习笔记1

    vue1-2:MVVM M:Model 数据模型,负责数据存储 V:View 视图,负责页面的显示 VM:View Model 负责业务处理,对数据进行加工,之后交给视图 下载地址: <!--中 ...

  3. 使用工具自动生成Linq类文件

    第一部:运行cmd. 执行命令 cd C:\Program Files (x86)\Microsoft SDKs\Windows\v8.1A\bin\NETFX 4.5.1 Tools 第二步:执行 ...

  4. Codeforces Round #129 (Div. 2) A

    Description The Little Elephant loves Ukraine very much. Most of all he loves town Rozdol (ukr. &quo ...

  5. Storm概念学习系列之Worker、Task、Executor三者之间的关系

    不多说,直接上干货! Worker.Task.Executor三者之间的关系 Storm集群中的一个物理节点启动一个或者多个Worker进程,集群的Topology都是通过这些Worker进程运行的. ...

  6. linux上的shutdown命令

    定时关机:shutdown -r now 立刻重新开机 shutdown -h now 立刻关机 shutdown -k now 'Hey! Go away! now....' 发出警告讯息, 但没有 ...

  7. Oracle 取上周一到周末的sql

    -- 这样取的是 在一周内第几天,是以周日为开始的 select to_char(to_date('20131005','yyyymmdd'),'d') from dual; --结果:7 注释:20 ...

  8. Cmder 简明使用说明

    简介 Cmder is a software package created out of pure frustration over the absence of nice console emul ...

  9. EF增删查改加执行存储过程和sql语句,多种方法汇总

    ActionUrl c = new ActionUrl() { ActionName="test", RequestUrl="/123/123", SubTim ...

  10. 在window下, Java调用执行bat脚本

    参考博客: https://www.cnblogs.com/jing1617/p/6430141.html 最近一段时间用到了Java去执行window下的bat脚本, 这里简单记录一下: 我这里是先 ...