JavaScript 之 Cookie

JavaScript是运行在客户端的脚本,因此一般是不能够设置Session的,因为Session是运行在服务器端的。

而cookie是运行在客户端的,所以可以用JS来设置cookie.

假设有这样一种情况,在某个用例流程中,由A页面跳至B页面,若在A页面中采用JS用变量temp保存了某一变量的值,在B页面的时候,同样需要使用JS来引用temp的变量值,对于JS中的全局变量或者静态变量的生命周期是有限的,当发生页面跳转或者页面关闭的时候,这些变量的值会重新载入,即没有达到保存的效果。解决这个问题的最好的方案是采用cookie来保存该变量的值,那么如何来设置和读取cookie呢?

首先需要稍微了解一下cookie的结构,简单地说:cookie是以键值对的形式保存的,即key=value的格式。各个cookie之间一般是以“;”分隔。

JS设置cookie:
 
假设在A页面中要保存变量username的值("jack")到cookie中,key值为name,则相应的JS代码为:

document.cookie="name="+username;  

JS读取cookie:
 
假设cookie中存储的内容为:name=jack;password=123
 
则在B页面中获取变量username的值的JS代码如下:

var username=document.cookie.split(";")[0].split("=")[1];  

//JS操作cookies方法! 

//写cookies 

function setCookie(name,value)
{
    var Days = 30;
    var exp = new Date();
    exp.setTime(exp.getTime() + Days*24*60*60*1000);
    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
} 

//读取cookies
function getCookie(name)
{
    var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");

    if(arr=document.cookie.match(reg))

        return unescape(arr[2]);
    else
        return null;
} 

//删除cookies
function delCookie(name)
{
    var exp = new Date();
    exp.setTime(exp.getTime() - 1);
    var cval=getCookie(name);
    if(cval!=null)
        document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}
//使用示例
setCookie("name","hayden");
alert(getCookie("name")); 

//如果需要设定自定义过期时间
//那么把上面的setCookie 函数换成下面两个函数就ok; 

//程序代码
function setCookie(name,value,time)
{
    var strsec = getsec(time);
    var exp = new Date();
    exp.setTime(exp.getTime() + strsec*1);
    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getsec(str)
{
   alert(str);
   var str1=str.substring(1,str.length)*1;
   var str2=str.substring(0,1);
   if (str2=="s")
   {
        return str1*1000;
   }
   else if (str2=="h")
   {
       return str1*60*60*1000;
   }
   else if (str2=="d")
   {
       return str1*24*60*60*1000;
   }
}
//这是有设定过期时间的使用示例:
//s20是代表20秒
//h是指小时,如12小时则是:h12
//d是天数,30天则:d30 

setCookie("name","hayden","s20");
时间: 2024-10-09 19:47:40

JavaScript 之 Cookie的相关文章

httpOnly实现防止XSS时避免JavaScript读取cookie

如果cookie设置了HttpOnly标志,可以在发生XSS时避免JavaScript读取cookie,这也是HttpOnly被引入的原因. 实现方式: PHP中的设置     1.在php.ini中  session.cookie_httponly = true     2.在程序中全局设定:  <?php  ini_set("session.cookie_httponly", 1);  // or  session_set_cookie_params(0, NULL, NUL

Javascript操作cookie

从事web开发也有些日子了,cookie 是个啥差不多能说明白,可是实际自己一上手操作就是得去搜索(你们懂的),结果被鄙视了...所以就写一篇博文做为自己的学习笔记 什么是 Cookie "cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie.你可以使用 JavaScript 来创建和取回 cookie 的值." - w3school cookie 是访问过的网站创建的文件,用于存储浏览信息,例如个人资料信息. 从JavaS

javascript删除Cookie的正确方法(转载)

原来一直以为只要设置javascript的document.cookie对象就能简单的在浏览器端设置和删除cookie值,网上很多文章也是这么教的,但是最近发现简单的设置javascript的document.cookie的值无法完全做到删除或更改cookie.偶然发现了一篇文章给出了正确的方法,这里贴出来. 使用JavaScript清理Cookie首先要找到该Cookie对应的Name对应的值,然后设置其为过期: 找到Cookie有下面方法: function getCookie2(name)

JavaScript 操作 Cookie

从事web开发也有些日子了,cookie 是个啥差不多能说明白,可是实际自己一上手操作就是得去搜索(你们懂的),结果被鄙视了...所以就写一篇博文做为自己的学习笔记,嘿嘿,博客的好处在此体现出来了. 什么是 Cookie “cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie.你可以使用 JavaScript 来创建和取回 cookie 的值.” - w3school cookie 是访问过的网站创建的文件,用于存储浏览信息,例如个人

JavaScript创建cookie

创建一个欢迎cookie. 通过w3s文档的学习,终于把JavaScript的cookie欢迎页面扩清楚了.在这里与各位分享一下自己的cookie学习心得. ,希望对大家有所帮助.对于什么是cookie,cookie的各种官方解释我就不在这里解释了啊!直接介绍我demo了. 首先  我们要在页面加载的时候,直接调用欢迎页面.所以可以用onLoad 方法,onLoad这个方法,可以在每此加载页面的时候,最先调用. onLoad主动调用JavaScript服本checkCookie(). 下面是ch

javascript应用cookie的封装代码

javascript应用cookie的封装代码: 关于cookie的优缺点这里就不多介绍了,都是老生长谈了,不过对于cookie的操作可能很多学习者比较陌生,下面分享一个封装好的cookie操作代码,希望能够给需要的朋友带来一定的帮助. 代码如下: var cookie=new function(){ this.set=function(name,value,hours){ var life=new Date().getTime(); life+=hours*1000*60; var cooki

JavaScript中Cookie的用法

Javascript中Cookie主要存储于客户端的计算机中,用于存放已访问的站点信息,Cookie最大约为4k.以下实例主要用于页面在刷新时保存数据,具体的用法如下所示: <html> <head><title></title> </head> <body> <script type="text/javascript"> window.onload = function () { PersentVal

javascript操作cookie简单插件

javascript操作cookie简单插件:恰当灵活的使用cookie可以给用户带来诸多方便,尽管它一直被不少人士所诟病,但是它的应用还是无处不在,关于cookie这里就不多介绍了,具体可以参阅javascript如何操作cookie一章节,下面给出操作cookie的一个简单插件,代码如下: var cookie={ //创建cookie setCookie:function (name, value, iDay) { var oDate = new Date(); oDate.setDate

PHP的cookie与Javascript的cookie的关系

PHP 读写cookie的语句: setcookie("user", "Lilu", time()+3600); echo $_COOKIE["user"]; javascript读写cookie代码: function SetCookie(name,value)//两个参数,一个是cookie的名子,一个是值 { var Days = 30; //此 cookie 将被保存 30 天 var exp = new Date(); //new Da

java与javascript对cookie操作的工具类

Java对cookie的操作 package cn.utils; import java.util.HashMap; import java.util.Map; import javax.servlet.http.Cookie; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * 操作cookie的工具类(默认cookie的有效路径为"/")