cookie操作：设置cookie、读取cookie、删除cookie_set-cookie remove cookie

一、设置cookie

function setCookie(name, value){
    Days = 1; 
    var exp = new Date(); 
    exp.setTime(exp.getTime() + Days*24*60*60*1000); 

    var domain = window.location.host;
    var domains = domain.split('.');

    if (domains.length === 3){
        domains = domains.slice(1,3);
        domain = '.' + domains.join('.');
        document.cookie = name + "=" + escape (value) + "; expires=" + exp.toGMTString() + ";path=/;domain="+domain;
    }else{
        domain = domain;
        document.cookie = name + "="+ escape (value); 
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

二、读取cookie

function getCookie(name){
   var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
   if(arr=document.cookie.match(reg))
      return unescape(arr[2]);
   else
      return null;
}
注解：1、例如name=jack;password=123
     2、获取值：var pwd = getCookie(password);//pwd值为123
1
2
3
4
5
6
7
8
9

三、删除cookie

function DelCookie(name) {
	var domain = window.location.host;//获取当前页面域名
	var domainArr = domain.split('.');
    var exp = new Date();
    exp.setTime(exp.getTime() + (-1 * 24 * 60 * 60 * 1000));
    var cval = getCookie(name);
    
    if(domainArr.length === 3){
		domainArr = domainArr.slice(1,3);
		domain = '.'+domainArr.join('.');
    }

	document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString() + ";path=/;domain="+demain; 
}

function getCookie(name){
   var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
   if(arr=document.cookie.match(reg))
      return unescape(arr[2]);
   else
      return null;
}
注解：删除值：DelCookie(name);//删除用户名jack
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

四、cookie属性

cookie对象主要属性

name：cookie的名称。

value：cookie的值。

domain：为可以访问此cookie的域名。
（1）非顶级域名，如二级域名或者三级域名，设置的cookie的domain只能为顶级域名或者二级域名或者三级域名本身，不能设置其他二级域名的cookie，否则cookie无法生成。
（2）顶级域名只能设置domain为顶级域名，不能设置为二级域名或者三级域名，否则cookie无法生成。
（3）二级域名能读取设置了domain为顶级域名或者自身的cookie，不能读取其他二级域名domain的cookie。所以要想cookie在多个二级域名中共享，需要设置domain为顶级域名，这样就可以在所有二级域名里面或者到这个cookie的值了。
顶级域名只能获取到domain设置为顶级域名的cookie，其他domain设置为二级域名的无法获取。

path：为可以访问此cookie的页面路径。 比如domain是abc.com,path是/test，那么只有/test路径下的页面可以读取此cookie。

expires/Max-Age ：为此cookie超时时间。若设置其值为一个时间，那么当到达此时间后，此cookie失效。不设置的话默认值是Session，意思是cookie会和session一起失效。当浏览器关闭(不是浏览器标签页，而是整个浏览器) 后，此cookie失效。

Size：cookie的大小。

http：  cookie的httponly属性。若此属性为true，则只有在http请求头中会带有此cookie的信息，而不能通过document.cookie来访问此cookie。

secure ： 设置是否只能通过https来传递此条cookie
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

五、Vue下的myCookie.js文件

var config = require('./config');//配置文件（包含地址）
var expires = config.cookieExpires; //= 24 * 60 * 60 * 1000;
var paths = config.getPaths(); //.test.com

/**添加cookie**/
export const addCookie = function(name, value) {
	var exp = new Date();
	exp.setTime(exp.getTime() + expires);
	document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString() + ";domain=" + paths.domain + ";path=/";
};

/**获取cookie**/
export const getCookie = function(name) {
	var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
	if(arr = document.cookie.match(reg))
		return unescape(arr[2]);
	else
		return null;
};

/**删除cookie**/
export const delCookie = function(name) {
	var exp = new Date();
	exp.setTime(exp.getTime() - 10000);
	var cval = getCookie(name);
	if(cval != null)
		document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString() + ";domain=" + paths.domain + ";path=/";
};
/**删除所有cookie**/
export const clearCookie = function(name) {
	var exp = new Date();
	exp.setTime(exp.getTime() - 10000);
	var keys=document.cookie.match(/[^ =;]+(?=\=)/g);
  if (keys) {
    for (var i =  keys.length; i--;)
      document.cookie = keys[i] + "=0; expire="+exp.toGMTString() + ";domain=" + paths.domain + ";path=/";
  }
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

Cookie是一种在客户端存储信息的机制，通常用于在Web浏览器和服务器之间传递信息。当用户访问一个网站时，服务器可能会在用户的浏览器上设置一个或多个Cookie。这些Cookie包含了一些信息，如用户ID、会话标识符、用户首选项等。

当用户再次访问该网站时，浏览器会将存储的Cookie发送回服务器。这样，服务器就可以使用这些Cookie中的信息来识别用户、跟踪用户会话或提供个性化服务。

需要注意的是，使用Cookie时需要遵循一些隐私和安全原则，确保不会滥用或泄露用户的敏感信息。

六、JavaScript概念

JavaScript是一种广泛使用的编程语言，主要用于网页开发。

JavaScript的基本概念：

• 变量和数据类型：在JavaScript中，你可以使用变量来存储各种数据，如数字、字符串、布尔值、对象、数组等。JavaScript是一种弱类型语言，这意味着变量的类型可以在运行时改变。
• 函数：函数是一段可重复使用的代码块，可以接受参数并返回一个值。在JavaScript中，函数可以作为一等公民，可以作为参数传递给其他函数，也可以作为变量存储。
• 对象：对象是包含属性和方法的集合。属性是变量，方法则是函数。在JavaScript中，对象是使用花括号{}来创建的。
• 事件：事件是用户与网页交互时发生的事情，如点击、鼠标移动、键盘输入等。JavaScript允许你定义事件处理程序，以便在事件发生时执行特定的代码。
• DOM（文档对象模型）：DOM是HTML和XML文档的编程接口，它提供了一种方式来访问和操作文档的结构。在JavaScript中，你可以使用DOM来动态地修改网页内容、结构和样式。
• 异步编程：JavaScript是单线程的，这意味着它一次只能执行一个任务。为了提高性能并允许用户与网页交互，JavaScript使用异步编程模型，如回调函数、Promises和async/await。
• 模块和模块化：在现代JavaScript开发中，模块是一种组织代码的方式。通过模块化，你可以将代码分解为独立的文件，每个文件都有一个特定的功能或任务。

JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
JavaScript 是 web 开发人员必须学习的 3 门语言中的一门：HTML 定义了网页的内容，CSS 描述了网页的布局，JavaScript 控制了网页的行为。

七、热门文章

【温故而知新】JavaScript数字精度丢失问题
【温故而知新】JavaScript的继承方式有那些
【温故而知新】JavaScript中内存泄露有那几种
【温故而知新】JavaScript函数式编程
【温故而知新】JavaScript的防抖与节流
【温故而知新】JavaScript事件循环