JS操作Cookie

什么是 Cookie

cookie 是一些数据，存在于你的电脑上的文本文件中。当 web 服务器向浏览器发送页面时，当页面关闭，服务器是不会记录相关用户的信息，比如，用户的账户名，密码，或者是访问的时间等，为了解决这个问题，提出了 cookie。cookie 的作用就是解决：客户端存放用户信息。

• 当用户访问页面时，cookie 可以存放用户信息
• 当用户下次访问页面时，可以从 cookie 读取用户信息

cookie 是以名 / 值对形式存储的
username = tom
当浏览器从服务器请求页面时，该页面的 cookie 会被添加到请求中，服务端通过这种方式来读取用户信息。

利用 JS 来创建，读取，修改，删除 Cookies

创建： document.cookie = "username = tom";
读取： let cookies = document.cookie;
修改： document.cookie = "username = ann";
删除：document.cookie = "username=;expires=Thu,01 Jan 1970 00:00:00 GMT";
修改类似于创建 cookie，创建后，直接覆盖掉原来原有的 cookie。
删除只需将 expires 过期时间设置为以前即可

Cookie 字符串

Cookie 并不是一个字符串，当 document.cookie 被重新设置时，旧的 Cookie 不会被覆盖，而是传入添加到原来的 cookie 中

Cookie 简单的使用

输入用户名，传入 Cookie 中，下次访问时直接从 cookie 中读取用户名数据并输出

function setCookie(cname,cvalue,ctime){
  let time = new Date();
  time.setTime(time.getTime() + ctime*24*60*60*1000);
  let expires = "expires" + time.toGMTString();
  document.cookie = cname + "=" + cvalue + ";" + expires;
}

function getCookie(cname){
  let name = cname + "=";
  let ca = document.cookie.split(';');
  for(let i = 0; i < ca.length ; i++){
    let item = ca[i].trim();
    if(item.indexOf(name) == 0){
      return item.substring(name.length,item.length);
    }
  }
  return "";
}

function checkCookie(){
  let user = getCookie("username");
  if(user!=""){
    alert("welcome"+user);
  }else {
    let user = prompt("pls enter your name:","");
    if(user != "" && user != null){
      setCookie("username",user,30);
    }
  }
}

window.onload = function(){
  checkCookie();
}