HTTP cookies，也称为‘cookie’，已经存在了很长时间，但仍然没有被完全理解。第一个问题是，有许多误解认为cookies是后门或病毒，或者他们根本不知道它是如何工作的。第二个问题是缺乏一致的cookies接口。尽管存在这些问题，但cookie在web开发中仍然发挥着如此重要的作用，以至于如果cookie在没有替代品的情况下消失，许多我们喜欢的Web应用程序将变得毫无用处。

1.饼干的起源。

Cookie最早是由网景公司的员工Lou Montulli在1993年3月发明的，后来被W3C采用。目前cookie已经成为一个标准，ie、Chrome、Firefox、Opera等所有主流浏览器都支持。

Cookie的诞生是因为HTTP协议的固有缺陷，它是一种无状态协议。一旦简单的请求和响应完成，客户端和服务器之间的连接将被关闭，需要建立一个新的连接来再次交换数据。这意味着服务器无法从连接中跟踪会话，也就是说，服务器不知道它是哪个客户端。

登录/购物车等一些典型应用无法实现。比如用户A在商场购买的商品，无论用户A什么时候购买，都要放在A的购物车里，属于同一个会话，不能放在不属于同一个会话的用户B或者用户C的购物车里。

基本原理如图所示。

第二，cookie操作。

对cookie的操作包括以下内容。

1.姓名)2。值)3。领域)4。路径)5。截止日期6。安全7号。仅http(仅服务器)。

注意cookie大部分是服务器创建的，JS也可以创建cookie，但是HttpOnly类型的JS不能创建cookie。

浏览器提供的cookie API (document.cookie)太粗糙，可以稍微封装一下。例如，使用下面的setter/getter cookie函数要方便得多。

/** JS cookie写入和cookie读取操作* * * *取cookies * * * cookie*** cookie(名称)** ** * *写入cookie * * * cookie(名称、值)* cookie(名称、值、选项)*/var cookie=函数(名称、值、选项){var doc=documentif(值！=undefined){//set option=option | | { } if(value===null){ value=' ' option . expires=-1 } var expires=' ' if(option . expires=' number ' | | option . expires . toutstring)){ var date=new date if(type of option . expires=' number '){ date . settime(date . gettime()(option . expires * 24 * 60 * 60 * 1000))} else { date=option . expires }//for IEexpires='；expires=' date . TouchString()} var path=option . path？path=' option . path : ' ' var domain=option . domain？domain=' option . domain : ' ' var secure=option . secure？secure ' : ' ' doc . cookie=[名称，'='，encodeURIComponent(值)，过期，路径，域，secure]。join(“”)else {//get var cookieValue=null if(doc . cookie doc . cookie！=' '){ var cookies=doc . cookie . split('；')为(var I=0；i cookies.lengthi ) {var cookie=$。修剪(饼干[i])。split('=')if(cookie[0]==name cookie . length 1){ try { cookieValue=decodeURIComponent(cookie[1])} catch(e){ cookieValue=cookie[1]} break } } } return cookieValue } }；当然，还有更方便的https://github.com/florian/cookie.js,提供更方便的功能。

Iii .饼干类型。

1.普通cookies可以在服务器端和JS上创建，JS可以访问2。只有http的cookies只能由服务器端创建，而JS无法读取，这主要是基于安全考虑3。安全cookies(仅限HTTPS)可以在服务器端和JS上创建，而JS只能在https下访问。

比如在新浪云的测试页面：http://snandy.sinaapp.com/php/cookie.php,我种了三个cookie，分别是c1、c2、c3和C3。

$d1=mktime(1，1，1，1，1，2018)；//普通cookie setcookie ('C1 '，'杰克'，$ D1)；//Secure cookie，仅限https，第六个参数setcookie ('c2 '，' john '，$ d1，null，null，true)；httponly cookie的第7个参数set cookie(‘C3’，‘resig’，$ D1，null，null，true)；使用Firefox访问。

这三个物种我都有，萨尤特来自新浪云。

在firebug控制台中输入document.cookie。

可以看出c2和c3不可访问。C2是安全cookie，需要在https协议下访问，而c3是httpOnly，JS无法访问，需要注意。

将访问协议更改为https:https://snandy.sinaapp.com/php/cookie.php,将firebug切换到控制台并输入document.cookie您可以看到c2可以被访问。

第四，饼干坑。

1.当cookies太大或太多时，页面访问会报告错误，例如以下提示。

因此，网站上的cookie需要管理，cookie不能随意种植。此外，请尝试指定路径并将cookie限制在指定的范围内。

browsercookielimits.squawky.net网站记录了每个浏览器的cookie大小。

2.保存中文需要encodeURIComponent，否则乱码。