cookie封装做免输入登录

 2023-09-16 阅读 16 评论 0

摘要:网上借鉴了一些朋友的经验,做了一个小例子,js操作cookie,实现登录密码保存。cookie的存放方式是以键值对的方式保存的。 通常cookie和session,是web开发中用于存储信息的对象,session存在于服务器的内存中,而cookie则是存在客户端
  1. 网上借鉴了一些朋友的经验,做了一个小例子,js操作cookie,实现登录密码保存。cookie的存放方式是以键值对的方式保存的。

    通常cookie和session,是web开发中用于存储信息的对象,session存在于服务器的内存中,而cookie则是存在客户端,所以js可以直接操作cookie进行信息的存储和读取。

    js存放cookie一般的写法,如:document.cookie="userName=admin";,如果是多个键值对:document.cookie="userName=admin; userPass=123"; 

    java cookie使用,下面是js操作cookie保存用户的登录信息:

  2. <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title>无标题文档</title>
    <script>
    function addCookie(name, value, days, path) {
    var name = escape(name);
    var value = escape(value);
    var expires = new Date();
    expires.setTime(expires.getTime() + days * 3600000 * 24);
    //path=/,表示cookie能在整个网站下使用,path=/temp,表示cookie只能在temp目录下使用
    path = path == "" ? "" : ";path=" + path;
    //GMT(Greenwich Mean Time)是格林尼治平时,现在的标准时间,协调世界时是UTC
    //参数days只能是数字型
    var _expires = (typeof days) == "string" ? "" : ";expires=" + expires.toUTCString();
    document.cookie = name + "=" + value + _expires + path;
    }

    function getCookieValue(name) { /**获取cookie的值,根据cookie的键获取值**/
    //用处理字符串的方式查找到key对应value
    var name = escape(name);
    //读cookie属性,这将返回文档的所有cookie
    var allcookies = document.cookie;
    //查找名为name的cookie的开始位置
    name += "=";
    var pos = allcookies.indexOf(name);
    //如果找到了具有该名字的cookie,那么提取并使用它的值
    if(pos != -1) { //如果pos值为-1则说明搜索"version="失败
    var start = pos + name.length; //cookie值开始的位置
    var end = allcookies.indexOf(";", start); //从cookie值开始的位置起搜索第一个";"的位置,即cookie值结尾的位置
    if(end == -1) end = allcookies.length; //如果end值为-1说明cookie列表里只有一个cookie
    var value = allcookies.substring(start, end); //提取cookie的值
    return(value); //对它解码
    } else { //搜索失败,返回空字符串
    return "";
    }
    }

    function deleteCookie(name, path) { /**根据cookie的键,删除cookie,其实就是设置其失效**/
    var name = escape(name);
    var expires = new Date(0);
    path = path == "" ? "" : ";path=" + path;
    document.cookie = name + "=" + ";expires=" + expires.toUTCString() + path;
    }

    cookie注册登录? /**实现功能,保存用户的登录信息到cookie中。当登录页面被打开时,就查询cookie**/
    window.onload = function() {
    var userNameValue = getCookieValue("userName");
    document.getElementById("txtUserName").value = userNameValue;
    var userPassValue = getCookieValue("userPass");
    document.getElementById("txtUserPass").value = userPassValue;
    }

    function userLogin() { /**用户登录,其中需要判断是否选择记住密码**/
    //简单验证一下
    var userName = document.getElementById("txtUserName").value;
    if(userName == '') {
    alert("请输入用户名。");
    return;
    }
    var userPass = document.getElementById("txtUserPass").value;
    if(userPass == '') {
    alert("请输入密码。");
    return;
    }
    var objChk = document.getElementById("chkRememberPass");
    if(objChk.checked) {
    //添加cookie
    addCookie("userName", userName, 7, "/");
    addCookie("userPass", userPass, 7, "/");
    alert("记住了你的密码登录。");
    window.location.href = "http://www.baidu.com";
    } else {
    alert("不记密码登录。");
    window.location.href = "http://www.baidu.com";
    }
    }
    </script>
    </head>

    <body>
    <center>
    <table width="400px" height="180px" cellpadding="0" cellspacing="0" border="1" style="margin-top:100px;">
    <tr>
    <td align="center" colspan="2">欢迎使用XXX管理系统</td>
    </tr>
    <tr>
    <td align="right">
    <label>用户名:</label>
    </td>
    <td align="left">
    <input type="text" id="txtUserName" name="txtUserName" style="width:160px; margin-left:10px;" />
    </td>
    </tr>
    <tr>
    <td align="right">
    <label>密 码:</label>
    </td>
    <td align="left">
    <input type="password" id="txtUserPass" name="txtUserPass" style="width:160px; margin-left:10px;" />
    </td>
    </tr>
    <tr>
    <td align="center" colspan="2">
    <span style="font-size:12px; color:blue; vertical-align:middle;">是否记住密码</span>
    <input type="checkbox" id="chkRememberPass" name="chkRememberPass" style="vertical-align:middle;" />
    </td>
    </tr>
    <tr>
    <td align="center" colspan="2">
    <input type="submit" id="subLogin" name="subLogin" value="登 录" οnclick="userLogin()" />

    <input type="reset" id="resetLogin" name="resetLogin" value="重 置" />
    </td>
    </tr>
    </table>
    </center>
    </body>

    cookie注册?</html>

转载于:https://www.cnblogs.com/damon-awesome/p/5770043.html

版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。

原文链接:https://hbdhgg.com/5/69819.html

发表评论:

本站为非赢利网站,部分文章来源或改编自互联网及其他公众平台,主要目的在于分享信息,版权归原作者所有,内容仅供读者参考,如有侵权请联系我们删除!

Copyright © 2022 匯編語言學習筆記 Inc. 保留所有权利。

底部版权信息