Web客户端数据存储学习笔记——Cookie

时间:2022-09-28 08:58:58

  

  今天对登录访问的安全以及web客户端存储做了一些大致的学习,决定在这方面加深理解,记录在博客里。第一个接触到的是Cookie...

WHAT?

WHY?

HOW?

在学习cookie的使用时发现其名称以及存储的字符串值是必须经过URL编码的。

然而网上的许多示例(包括 w3school中文站)都没有做这一处理,所以三哥参考阮一峰老师的关于URL编码博文找到了解决方案,在这里分享:

cookieUtil.js:
 //cookieUtil.js
var cookieUtil = { //读取"name"对应cookie的值
get : function(name){
var cookieName = encodeURIComponent(name)+"=", //对传入name参数URL编码
cookieStart = document.cookie.indexOf(cookieName),
cookieValue = null; if(cookieStart > -1){
var cookieEnd = document.cookie.indexOf(";",cookieStart);
if(-1 == cookieEnd){
cookieEnd = document.cookie.length; //cookie值为空
}
//对cookie保存的值URL解码
cookieValue = decodeURIComponent(document.cookie.substring(cookieStart+cookieName.length,cookieEnd));
}
       return cookieValue;
}, //创建或设置cookie 其中name将作为某一域内的唯一标示、不可更改
set : function(name,value,expires,path,domain,secure){
//对名称和值URL编码
var cookieText = encodeURIComponent(name)+"="+encodeURIComponent(value); if(expires instanceof Date){
cookieText += "; expires="+expires.toGMTString();
}
if(path){
cookieText += "; path="+path;
}
if(domain){
cookieText += "; domain="+domain;
}
if(secure){
cookieText += "; secure";
} //将根据name是否存在决定是否添加新的cookie字符串,需要注意:a、cookie长度(limit:4095B);b、每个域允许的cookie个数(各浏览器决定)
document.cookie = cookieText;
}, //删除cookie
unset : function(name,path,domain,secure){
this.set(name,"",new Date(0),path,domain,secure);
} }

WHEN?

BETTER!

updating

REFERENCE:

1、 关于URL编码

2、Cookie/Session机制详解

Web客户端数据存储学习笔记——Cookie的更多相关文章

  1. Html5——WEB(客户端)数据存储

    在客户端存储数据 HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前, ...

  2. 浏览器本地数据存储解决方案以及cookie的坑

    本地数据存储解决方案以及cookie的坑 问题: cookie过长导致页面打开失败 背景: 在公司的项目中有一个需求是打开多个工单即在同一个页面中打开了多个tab(iframe),但是需要在刷新时只刷 ...

  3. 本地数据存储解决方案以及cookie的坑

    本地数据存储解决方案以及cookie的坑 问题: cookie过长导致页面打开失败 背景: 在公司的项目中有一个需求是打开多个工单即在同一个页面中打开了多个tab(iframe),但是需要在刷新时只刷 ...

  4. 客户端数据存储cookie、localStoeage、sessionStorage(小记)

    一.数据存储分为客户端存储和服务端存储 1.而对于客户端存储,在html5以前只能通过cookie来实现:html 5以后增加了web存储(实际保存本地)的功能   (1)对于web存储有两个标准: ...

  5. Web安全攻防(简)学习笔记

    Web安全攻防-学习笔记 本文属于一种总结性的学习笔记,内容许多都早先发布独立的文章,可以通过分类标签进行查看 信息收集 信息收集是渗透测试全过程的第一步,针对渗透目标进行最大程度的信息收集,遵随&q ...

  6. 大数据 -- kafka学习笔记:知识点整理(部分转载)

    一 为什么需要消息系统 1.解耦 允许你独立的扩展或修改两边的处理过程,只要确保它们遵守同样的接口约束. 2.冗余 消息队列把数据进行持久化直到它们已经被完全处理,通过这一方式规避了数据丢失风险.许多 ...

  7. 重温Servlet学习笔记--Cookie对象

    首先要了解cookie必须得先了解http协议,,Cookie是http协议指定的,先由服务器保存cookie到浏览器,在下次浏览器请求服务器时把上次请求得到的cookie归还给服务器,cookie以 ...

  8. HTML5客户端数据存储

    HTML5 使在不影响网站性能的情况下存储大量数据成为可能.之前,这些都是由 cookie 完成的,cookie不适合大量数据的存储,因为会影响速度. 举个例子: var obj = {x:1}; / ...

  9. Web前端数据存储

    Cookie 会跟随每次请求附加到请求header上,大小限制4k. 部署对象: document.cookie 构成: Key-Value 有效期:根据expires配置 可选项: ;path=pa ...

随机推荐

  1. arithmetic

    字典序算法 http://www.cnblogs.com/darklights/p/5285598.html 字典排序(lexicographical order)是一种对于随机变量形成序列的排序方法 ...

  2. u-boot 之配置分析 (2)

    Makefile简要分析所有这些目录的编译连接都是由顶层目录的makefile来确定的. 1.在makefile中有: unconfig: @rm -f $(obj)include/config.h ...

  3. Text Template Transformation Toolkit

    Text Template Transformation Toolkit       1.且算简介         笔者以一个英文字母和一个数字取了一个简单的名字.名唤"T4"(名 ...

  4. Nginx 简单的负载均衡配置示例

    http://www.cnblogs.com/xiaogangqq123/archive/2011/03/02/1969006.html 在此记录下Nginx服务器nginx.conf的配置文件说明, ...

  5. css的repaint和reflow

    css的repaint和reflow 浏览器为了重新渲染部分或整个页面,重新计算页面元素位置和几何结构(geometries)的进程叫做 reflow. 由于 reflow 是一种浏览器中的用户拦截( ...

  6. linux命令sysctl使用

    以前没有注意过这个命令,直到有次在单位安装greenplum的时候,在没有配置系统参数的情况下,出现了设备空间不足的报错信息. 当然,安装的不是我的本机,而是公用的服务器,编辑修改系统参数后,仍然出现 ...

  7. x86/x64/x86_64/i386/ia32/ia64/amd/amd64 辨析

    x64 = x86_64 = amd64 64位指令集,是对IA-32的扩展,由AMD提出,implemented by AMD,Intel.可兼容32位指令集(IA-32) 目前大部分64位计算机均 ...

  8. [Swift]LeetCode893. 特殊等价字符串组 | Groups of Special-Equivalent Strings

    You are given an array A of strings. Two strings S and T are special-equivalent if after any number ...

  9. L1-039. 古风排版

    L1-039. 古风排版 中国的古人写文字,是从右向左竖向排版的.本题就请你编写程序,把一段文字按古风排版. 输入格式: 输入在第一行给出一个正整数N(<100),是每一列的字符数.第二行给出一 ...

  10. SqlServer :利用快捷键快速查看 字段说明查询及表结构 &lpar;小技巧)

    1.自定义4个常用的存储过程: sp_select :select * from sp_helpremark :查表的列,列的类型,备注(这里只查询有备注的列) sp_columns1 : 查表所有的 ...