js中利用cookie实现记住密码功能
2023-09-14 08:57:36 时间
在登录界面添加记住密码功能,代码如下:
//设置cookie var passKey = '4c05c54d952b11e691d76c0b843ea7f9'; function setCookie(cname, cvalue, exdays) { var d = new Date(); d.setTime(d.getTime() + (exdays*24*60*60*1000)); var expires = "expires="+d.toUTCString(); document.cookie = cname + "=" + encrypt(escape(cvalue), passKey) + "; " + expires; } //获取cookie function getCookie(cname) { var name = cname + "="; var ca = document.cookie.split(';'); for(var i=0; i<ca.length; i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1); if (c.indexOf(name) != -1){ var cnameValue = unescape(c.substring(name.length, c.length)); return decrypt(cnameValue, passKey); } } return ""; } //清除cookie function clearCookie(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方法的调用:
<input type="checkbox" id="rememberMe" checked="checked"/>记住密码
存入cookie
- 判断帐号密码无误后将用户名密码存入cookie
if($('#rememberMe').is(':checked')){ setCookie('customername', $('#username').val().trim(), 7) setCookie('customerpass', $('#password').val().trim(), 7) }
自动填充
- 进入登录界面后,判断cookie中是否有帐号密码,如果有就自动填充
$(function(){ //获取cookie var cusername = getCookie('customername'); var cpassword = getCookie('customerpass'); if(cusername != "" && cpassword != ""){ $("#username").val(cusername); $("#password").val(cpassword); } }
相关文章
- JS框架_(JQuery.js)纯css3进度条动画
- JS框架_(JQuery.js)圆形多选菜单选项
- JS框架_(JQbar.js)柱状图动态百分比进度条特效
- JS框架_(Qrcode.js)将你的内容转换成二维码格式
- JS框架_(JQuery.js)夜晚天空满天星星闪烁动画
- JS - 解决引入 js 文件无效的问题
- baguetteBox.js响应式画廊插件(纯JS)
- 当当网新用户注册界面——JS代码
- js逆向的题目,练习题12题,css静态字体反爬,
- [Node.js] Add Logging to a Node.js Application using Winston
- reactjs创建虚拟DOM的两种方式:使用jsx和js创建虚拟DOM
- When is abap.js loaded by Launchpad
- Atitit 调用另外语言的功能 目录 1. Waht 常见的语言java python js sql xml h5 c# php等之间的互相调用1 2. 为什么需要互相调用why1 3. 常
- Atitit.dart语言的特性 编译时js语言大总结
- 华为OD机试 - 最长的密码(Java & JS & Python)
- 带你了解Node.js包管理工具:包与NPM
- js 百度地图定位
- JS window.open()属性
- JS-MD5加密
- 【JS高级】js之正则相关函数以及正则对象_02
- 简单JS代--点击谁添加背景色
- html + css + js使用HBuilder开发工具做2048益智游戏