JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
cookie是网站设计者放置在客户端(浏览器)的小文本文件,cookie不仅能够实现保存密码功能,还可以通过cookie保存最近浏览记录增加用户体验。
在登录界面添加记住密码功能,我首先想到的是在java后台中调用cookie存放账号密码,大致如下:
HttpServletRequestrequest HttpServletResponseresponse Cookieusername=newCookie("username","cookievalue"); Cookiepassword=newCookie("password","cookievalue"); response.addCookie(username); response.addCookie(password);
但是为安全起见,我们在后台获取的密码大多是在js中通过MD5加密后的密文,如果将密文放到cookie中,在js中获取到也没有作用;
然后考虑在js中存取cookie,代码如下:
//设置cookie varpassKey='4c05c54d952b11e691d76c0b843ea7f9'; functionsetCookie(cname,cvalue,exdays){ vard=newDate(); d.setTime(d.getTime()+(exdays*24*60*60*1000)); varexpires="expires="+d.toUTCString(); document.cookie=cname+"="+encrypt(escape(cvalue),passKey)+";"+expires; } //获取cookie functiongetCookie(cname){ varname=cname+"="; varca=document.cookie.split(';'); for(vari=0;i<ca.length;i++){ varc=ca[i]; while(c.charAt(0)=='')c=c.substring(1); if(c.indexOf(name)!=-1){ varcnameValue=unescape(c.substring(name.length,c.length)); returndecrypt(cnameValue,passKey); } } return""; } //清除cookie functionclearCookie(cname){ setCookie(cname,"",-1); }
setCookie(cname,cvalue,exdays)三个参数分别是存放的cookie名字、cookie值、cookie有效天数
由于cookie中不能包含等号、空格、分号等特殊字符,我在设置cookie时使用escape()函数对字符串进行编码,获取cookie时使用unescape()函数解码。但是escape()函数不会对ASCII字母和数字进行编码,所以存放到cookie中的账号、密码是以明文存放的,不安全。于是上网找了一个对字符串加密解密算法,该算法需要传两个参数,一个需要加密的字符串,一个自定义加密密钥passKey。设置cookie时使用encrypt(value,passkey)加密,读取cookie时使用decrypt(value,passKey)解密,该算法附在本文最后。
存取cookie方法的调用:
1、定义checkbox
<inputtype="checkbox"id="rememberMe"checked="checked"/>记住密码
2、判断帐号密码输入无误后调用
if($('#rememberMe').is(':checked')){ setCookie('customername',$('#username').val().trim(),7) setCookie('customerpass',$('#password').val().trim(),7) }
3、进入登录界面后,判断cookie中是否有帐号密码,如果有就自动填充
$(function(){ //获取cookie varcusername=getCookie('customername'); varcpassword=getCookie('customerpass'); if(cusername!=""&&cpassword!=""){ $("#username").val(cusername); $("#password").val(cpassword); } }
最后附上字符串加密解密算法
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){returnr[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(newRegExp('\\b'+e(c)+'\\b','g'),k[c]);returnp}('AG(a,b){x(b==v||b.7<=0){D.y("zRPO");tv}6c="";s(6i=0;i<b.7;i++){c+=b.u(i).n()}6d=m.r(c.7/5);6e=l(c.9(d)+c.9(d*2)+c.9(d*3)+c.9(d*4)+c.9(d*5));6f=m.M(b.7/2);6g=m.B(2,C)-1;x(e<2){D.y("LKJz");tv}6h=m.F(m.H()*N)%I;c+=h;w(c.7>q){c=(l(c.o(0,q))+l(c.o(q,c.7))).n()}c=(e*c+f)%g;6j="";6k="";s(6i=0;i<a.7;i++){j=l(a.u(i)^m.r((c/g)*E));x(j<p){k+="0"+j.n(p)}Qk+=j.n(p);c=(e*c+f)%g}h=h.n(p);w(h.7<8)h="0"+h;k+=h;tk}AS(a,b){6c="";s(6i=0;i<b.7;i++){c+=b.u(i).n()}6d=m.r(c.7/5);6e=l(c.9(d)+c.9(d*2)+c.9(d*3)+c.9(d*4)+c.9(d*5));6f=m.F(b.7/2);6g=m.B(2,C)-1;6h=l(a.o(a.7-8,a.7),p);a=a.o(0,a.7-8);c+=h;w(c.7>q){c=(l(c.o(0,q))+l(c.o(q,c.7))).n()}c=(e*c+f)%g;6j="";6k="";s(6i=0;i<a.7;i+=2){j=l(l(a.o(i,i+2),p)^m.r((c/g)*E));k+=T.U(j);c=(e*c+f)%g}tk}',57,57,'||||||var|length||charAt||||||||||||parseInt|Math|toString|substring|16|10|floor|for|return|charCodeAt|null|while|if|log|key|function|pow|31|console|255|round|encrypt|random|100000000|the|change|plesae|ceil|1000000000|empty|be|else|cannot|decrypt|String|fromCharCode'.split('|'),0,{}))
PS:下面看下js操作cookie的相关函数
//设置cookie函数,三个参数,一个是cookie的名子,一个是值,一个是设置cookie保存时间,单位:天 functionSetCookie(name,value,days){ vardays=arguments[2]?arguments[2]:30;//此cookie将被保存30天 varexp=newDate();//newDate("December31,9998"); exp.setTime(exp.getTime()+days*86400000); document.cookie=name+"="+escape(value)+";expires="+exp.toGMTString(); } //取cookies函数 functiongetCookie(name){ vararr=document.cookie.match(newRegExp("(^|)"+name+"=([^;]*)(;|$)")); if(arr!=null){ returnunescape(arr[2]); } returnnull; } //删除cookie函数 functiondelCookie(name){ varexp=newDate(); exp.setTime(exp.getTime()-1); varcval=getCookie(name); if(cval!=null){ document.cookie=name+"="+cval+";expires="+exp.toGMTString(); } }
以上所述是小编给大家介绍的JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!