Cookie

1：通信协议

定义：通信协议是指双方实体完成通信或服务所必须遵循的规则和约定。协议定义了数据单元使用的格式，信息单元应该包含的信息与含义，连接方式，信息发送和接收的时序，从而确保网络中数据顺利地传送到确定的地方。
总结一句话：交流的规则。比如：汉语、英语、德语、日语等。
在计算机通信中，通信协议用于实现计算机与网络连接之间的标准，网络如果没有统一的通信协议，电脑之间的信息传递就无法识别。 通信协议是指通信各方事前约定的通信规则，可以简单地理解为各计算机之间进行相互会话所使用的共同语言。两台计算机在进行通信时，必须使用的通信协议。
常见的协议有：TCP/IP协议、HTTP协议等等。

2：HTTP协议

超文本传输协议（HTTP，HyperText Transfer Protocol）是互联网上应用最为广泛的一种网络协议。所有的WWW文件都必须遵守这个标准。该协议用于从WWW服务器传输超文本到本地浏览器的传输协议。它可以使浏览器更加高效，使网络传输减少。它不仅保证计算机正确快速地传输超文本文档，还确定传输文档中的哪一部分，以及哪部分内容首先显示(如文本先于图形)等。
HTTP协议是一个无状态的通信协议，一旦数据交换完毕，客户端与服务器端的连接就会关闭，再次交换数据需要建立新的连接。它基于TCP协议的一种高级协议，用于客户端和服务器直接的通信。http 默认端口号 80 https（secure）协议 默认端口号443

3：cookie的概念

指某些网站为了辨别用户身份，进行session（会话）跟踪而存储在用户本地终端上的数据（通常经过加密）。以文本形式存在。
谷歌浏览器存储地址： C:\Users\用户名\AppData\Local\Google\Chrome\User Data\Default\文件夹下的Cookies文件。
注：cookie 只有在服务器环境下才有用

禁用cookie：改变浏览器的cookie设置。如果浏览器完全禁止cookie功能的话，大多数网站的基本功能无法正常使用。

4：cookie的特点

1：chrome和safari没有对cookie的个数做限制，一般浏览器限制同一域名数量为50个。
2：cookie文件的总大小一般为4KB（同一个域名）。
3：只能使用文本文件。
4：读取有域名限制。 域名 www.baidu.com www.taobao.com so.com
不可跨域读取,只能由来自 写入cookie的 同一域名 的网页可进行读取。 简单的讲就是,谁写的cookie,谁才有权利读取 (身份牌是我发你的,当然只有我能读取,你媳妇儿的手机自动连接了邻居老王家的wifi,你知道这意味着什么吗?)
5：时效限制。
每个cookie都有时效,最短的有效期是,会话级别:就是当浏览器关闭,那么cookie立即销毁。

5：cookie的使用

添加cookie：document.cookie = “key=value”; // 一次写入一个键值对
document.cookie = 'test1=hello';
document.cookie = 'test2=world';
//在浏览器中查看一下现在的cookie是什么样子   打开控制台 点击application 就能看到cookies
//注意 document.cookie一次只能写入一个 Cookie，而且写入并不是覆盖，而是添加

读取cookie：document.cookie;

document.cookie // "test1=hello; test2=world"

上面代码从document.cookie一次性读出两个 Cookie，它们之间使用 分号空格 分隔。必须手动还原，才能取出每一个 Cookie 的值。

var cookies = document.cookie.split('; ');

for (var i = 0; i < cookies.length; i++) { 
      console.log(cookies[i]);
}
// foo=bar// baz=bar

修改cookie：document.cookie = “key=value”; // 修改名为key的cookie值

document.cookie = 'test2=hah';
document.cookie // "test1=hello; test2=hah"

上面代码修改了test2对应的值

失效时间：expires ，没有设置失效时间的cookie 在浏览器关闭以后就会自动删除，如果设置了失效时候在未来的时间，就可以让cookie保存的时间长一点
设置失效时间：document.cookie = “key=value;expires=”+ oDate;

var oDate = new Date();
oDate.setDate(oDate.getDate() + 7);
document.cookie = “key=value;expires=”+ oDate;
//上面代码设置cookie的过期时间为7天以后

删除cookie：将cookie值覆盖为空，并将失效时间设置为过去的时间。

var oDate = new Date();
oDate.setDate(oDate.getDate() -7);
document.cookie = “test=;expires=”+ oDate;
//将cookie的过期时间设置为 7天前，test 这个cookie 就获取不到了

设置域名：domain
设置域名：document.cookie = “key=value;domain=www.baidu.com“;
注：必须在绑定域名的服务器才可以设置域名，上不同服务器之间的cookie文件不能共享。

设置路径：path
设置路径： document.cookie = “key=value;path=/“;

注：在同一路径下的网页可以共享cookie，路径不同时，不可以访问。

document.cookie = “key=value;path=/“;//设置cookie的路径为跟路径，这样我们网站下的所有页面可以共享cookie

注：如果有中文内容，需要用encodeURIComponent(‘xxxx’)进行编码，再使用decodeURIComponent(‘xxxx’)进行解码，解决中文乱码的问题。

6：cookie的封装
增加/修改cookie函数：

function setCookie(name,value,iDay){
    var newDate = new Date();
    newDate.setDate(newDate.getDate()+iDay);
//编码  把可能为中文的编码一下
     console.log(name)
    value = encodeURIComponent(value);
    console.log(name)

    document.cookie=name+"="+value+";expires="+newDate+";path=/";
}

获取cookie函数：

function getCookie(name){
     //解码
    cookie = decodeURIComponent(document.cookie);
    var arr = cookie.split("; ");
    for(var i =0; i<arr.length; i++){
        var arr2 = arr[i].split("=");
        if(arr2[0] == name){
            return arr2[1];
        }
    }
}

删除cookie函数：

function removeCookie(name){
      setCookie(name,1,-100);
}

7：cookie和json
JSON 格式（JavaScript Object Notation 的缩写）是一种用于数据交换的文本格式，2001年由 Douglas Crockford 提出，目的是取代繁琐笨重的 XML 格式。
相比 XML 格式，JSON 格式有两个显著的优点：书写简单，一目了然；符合 JavaScript 原生语法，可以由解释引擎直接处理，不用另外添加解析代码。所以，JSON 迅速被接受，已经成为各大网站交换数据的标准格式，并被写入标准。
每个 JSON 对象就是一个值，可能是一个数组或对象
JSON 对值的类型和格式有严格的规定

json的值只能是数组或对象，不能是函数、正则表达式对象、日期对象。
字符串必须使用双引号表示，不能使用单引号。
对象的键名必须放在双引号里面。
数组或对象最后一个成员的后面，不能加逗号。
以下都是合法的 JSON。

["one", "two", "three"]

{ "one": 1, "two": 2, "three": 3 }

{"names": ["张三", "李四"] }

[ { "name": "张三"}, {"name": "李四"} ]

以下都是不合法的 JSON。

{ name: "张三", 'age': 32 }  // 属性名必须使用双引号

[32, 64, 128, 0xFFF] // 不能使用十六进制值

{ "name": "张三", "age": undefined } // 不能使用 undefined

{ "name": "张三",
  "birthday": new Date('Fri, 26 Aug 2011 07:13:10 GMT'),
  "getName": function () {
      return this.name;
  }} // 属性值不能使用函数和日期对象

JSON对象是 JavaScript 的原生对象，用来处理 JSON 格式数据。它有两个方法：JSON.stringify()和JSON.parse()。
JSON.stringify方法用于将一个值转为 JSON 字符串。该字符串符合 JSON 格式，并且可以被JSON.parse方法还原。

JSON.stringify([1, 1])// '[1,1]'

JSON.stringify({ name: "张三" })// '{"name":"张三"}'

JSON.parse方法用于将 JSON 字符串转换成对应的值。

JSON.parse('{}') // {}
JSON.parse('[1, 5]') // [1, 5]
var o = JSON.parse('{"name": "张三"}');
o.name // 张三

我们可以把js中的对象，转为字符串，存贮在cookie中，从而来存贮复杂的数据

var userObj = {name:"张三",age:18}
var jsonStr = JSON.stringify(userobj);
setCookie('userinfo',jsonStr,7)//把用户的信息存储在cookie中


var arr = [
{name:"张1",age:18},
{name:"张2",age:18},
{name:"张3",age:18}
]
var jsonStr = JSON.stringify(arr);
setCookie('users',jsonStr,7)//把多个账户息存储在cookie中

8：XSS的攻击
跨站脚本攻击(Cross Site Scripting)，为不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆，故将跨站脚本攻击缩写为XSS。恶意攻击者往Web页面里插入恶意Script代码，当用户浏览该页之时，嵌入其中Web里面的Script代码会被执行，从而达到恶意攻击用户的目的。
跨站脚本攻击的核心在于脚本的成功注入，并二次展示。通常服务器端都会对文本内容进行安全性的过滤。