cookie应用

最新推荐文章于 2021-03-26 09:40:05 发布

风雨潇潇

最新推荐文章于 2021-03-26 09:40:05 发布

阅读量1k

点赞数

分类专栏： JavaScript自学大全文章标签： function cookies domain path button date

本文链接：https://blog.csdn.net/Long_carol/article/details/6077635

版权

JavaScript自学大全专栏收录该内容

12 篇文章 0 订阅

订阅专栏

1.客服端和服务端通讯的时候，我们知道常常要保存客服端的一些信息：如用户的信息，用户状态信息等等，然后再客户端进行比较验证，那么为了更好提高网站的运行效率，我们可以用cookie保存客服端的信息，通常我们的计算在浏览网页的时候，cookie都是以文件的形式保存在我们客服端计算机种的

2.下面我们就要弄清cookie的组成，我们才能更好的利用它

组成部分：一：名称：cookie由cookie名称即cookie的标识符组成，cookie的名称可以用来存cookie的信息

二：值：与变量值相同，也就是存放cookie中的内容

三：生成周期：cookie的生成周期默认是浏览器关闭的时候，cookie消失，但是可以设置它的生命周期

四：路径：不是哪个网页创建它就只能由哪个网页来访问，而是与该网页处于同一级目录或者他的子目录都可以访问的

五：域：既是设置了cookie的路径，cookie也不能跨域访问，只有设置了cookie的允许跨域

六：安全性：cookie是以明文的形式传递信息的，我们需要进行编码进行https传递

3.cookie是使用比较方面但是我们需要注意：

每一个网页可以创建一个或者多个cookie，但是都会放在同一个cookie文件中

每一个cookie文件不能超过4kb,并且存放cookie的数量不能超过300个

每一个域创建的cookie不能超过20个

用户可以通过浏览器设置是否允许创建cookie

cookie是以文件的形式存在的

4. 可以通过document文档对象来创建或者获取cookie

一：创建cookie

document.cookie="name=value; expires=date; path=path; domain=domain; secure";

name代表cookie的名称

value代表cookie的值

expires代表设置cookie的时间，即生命周期

path代表cookie的路径

domain代表cookie的域

secure代表用于设置cookie的安全性

注意：除了name是必选参数，其余的是可选参数

5.通过document对象获取所以cookie的值

var cookievalue=document.cookie;

这是获得所有cookie的值，因此我们在返回cookie值的时候进行判断

6下面举一个实例应用一下

一：点击按钮我们创建cookie

   function setCookie()
{
var myName=myForm.myName.value;                //用户输入的用户名
var mySex=myForm.mySex.value;                       //用户输入的性别
document.cookie="UserName="+myName;        //创建cookie，名称为UserName
document.cookie="UserSex="+mySex;              //创建cookie,名称为UserSex
alert("cookie设置完成!");                                     //弹出cookie的值
}

二：上面创建cookie完成，下面我们在来查看，这创建的cookie，点击按钮查看

三：我们在按照cookie的名称取得对应的cookie的值，在点击按钮时候我们调用这个方法，并且输入我们创建的cookie的名称UserName

来得到UserName的值

用这种方式来保存客服端的信息，即提高了网站的运行效率，还可以减轻服务器端的压力

下面写个实例代码

<head runat="server">
   <title>JAAVASCRIPT的Cookie的应用</title>
</head>
<body>
   <form id="form1" runat="server">
   <div>
   <table cellpadding="0" cellspacing="0" align="center">
   <tr><td>用户名:</td><td><input type="text" id="txtName" /></td></tr>
   <tr><td>密码:</td><td><input type="text" id="txtPass" /></td></tr>
   <tr><td><input type="button" value="记住cookie" width="20px" οnclick="SetCookie()"/> </td>
   <td><input type="button" value="查看cookie值" width="20px" οnclick="GetCookie('username')" /></td></tr>
   </table>
   </div>
   <script type="text/javascript" >
   function SetCookie()
   {
   var userName=document.getElementById("txtName").value;
   var userPass=document.getElementById("txtPass").value;
   if(userName!=""&&userPass!="")
   {
   // 设置15分钟到期，要用60000毫秒乘15分钟
   var expiration = new Date((new Date()).getTime() + 15 * 60000);
   var sName=userName+"|"+userPass;
   document.cookie="username="+escape(sName)+";expires="+expiration.toGMTString()+";path="+"/";
   alert("设置完成!");
   }
   else
   {
   alert("请填写完整");
   }
   }
   function GetCookie(cookieName)
   {
   var allcookies = document.cookie;
   alert(allcookies);
   var cookie_pos = allcookies.indexOf(cookieName);
   if (cookie_pos!= -1)
   {
   cookie_pos += cookieName.length + 1;
   var cookie_end = allcookies.indexOf(";", cookie_pos);
   if (cookie_end == -1)
   {
   cookie_end = allcookies.length;
   }
   var values = unescape(allcookies.substring(cookie_pos, cookie_end));
   var str=values.split('|');
   var sn=str[0];
   var ps=str[1];
   alert("用户名为:"+sn+" "+"密码为:"+ps);
   }
   }
   </script>
   </form>
</body>
</html>

风雨潇潇

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
cookie应用

<br />1.客服端和服务端通讯的时候，我们知道常常要保存客服端的一些信息：如用户的信息，用户状态信息等等，然后再客户端进行比较验证，那么为了更好提高网站的运行效率，我们可以用cookie保存客服端的信息，通常我们的计算在浏览网页的时候，cookie都是以文件的形式保存在我们客
复制链接

扫一扫