• cookie JS验证码


    现在正在做一个CRM模块的网上商城项目,我的任务是完成用户和客户的注册,谈到注册,一般人都会有个大概的框图,譬如用户名不能重复了,要有验证码了等等。我所处理的方法都是用js来实现的,但是在验证码这,我还心存疑虑,总觉得不是这么做的。刚开始的方法是,随机生成一个四位的数字,用户填写的值要与这个验证码上出现的值相同才可以通过。后来,同学告诉我验证码牵涉的东西很多,包括背景图片的加载,还有字符等等。这些都跟cookie有关。g.cn了下,发现JS实现验证码的大同小异,都是简单的操作。后来发现一个程序用到了一个cookie,于是自己也尝试着更改了下,变动是指把随机生成的字符存储在cookie里,在做验证的时候,再从cookie里获取。不知道这样能够防止恶意攻击呢?

    cookie究竟是个什么东东呢?

    说白了就是一个由服务端生成给客户端的。如果用户使用与上一次相同的浏览器访问上次的那个网站时,会把该cookie给服务端。也许举个熟悉的例子,你就知道了。你每次登陆一个网站的时候,如果你选中‘记住我’,下次的登录的时候,你的用户信息就直接显示在表单里,这样其实方便了很多。这是为什么呢?如果你选中‘记住我’,通知这次的请求会让Cookie通过HTTP Headers从服务器端返回到浏览器上。首先,服务器端在响应中利用Set-Cookie header来创建一个Cookie ,然后把相应的信息插入到指定的浏览器上。

    程序参考:

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
    <title>无标题页</title>
    </head>
    <body>
    <form id="form1" runat="server">
    <div>
    <div id="divCode" style="background-color:White; 52px; height:16px; padding:5px; text-align:center; vertical-align:middle; letter-spacing:5px; border:solid 1px blue"><span></span><span ></span><span ></span><span ></span></div>
    </div>
    <input id="Button1" type="button" value="换一张" onclick="JavaScript:validteCode()"/>
    <input type="textedit" name="CODE" id="NAME_CODE"/>
    <input type="button" id="Button2" value="验证" onclick="validate()"/>
    </form>
    </body>
    </html>
    <script language="JavaScript" type="text/JavaScript">
    function validate()
    {
    /* var str="";
    var code = form1.CODE.value;
    var spans = document.getElementById("divCode").all;
    for(var i=0;i<4;i++)
    str = str+spans[i].innerHTML;
    if(str != code)
    alert("输入验证码有误!");*/

    var sso = getCookie("sso_code");
    var str= sso.toString();
    var temp = "";
    for(var i=0;i<str.length;i++)
    {
    if(str.charAt(i) != ',')
    temp = temp+str.charAt(i);
    }
    alert(temp);
    var code = form1.CODE.value;
    alert(code);
    if(code != temp)
    alert("输入验证码有误!");
    }
    function validteCode()
    {
    var codes = new Array(4); //用于存储随机验证码
    var colors = new Array("Red","Green","Gray","Blue","Maroon","Aqua","Fuchsia","Lime","Olive","Silver");
    for(var i=0;i < codes.length;i++)
    {//获取随机验证码
    codes[i] = Math.floor(Math.random()*10);
    }

    //把随机生成的值存储在cookie里。
    setCookie("sso_code",codes);
    var spans = document.getElementById("divCode").all;
    for(var i=0;i<spans.length;i++)
    {
    spans[i].innerHTML=codes[i];
    spans[i].style.color = colors[Math.floor(Math.random()*10)]; //随机设置验证码颜色

    }


    }
    document.onload = validteCode();

    //cookie

    /**
    * Read the JavaScript cookies tutorial at:
    * http://www.netspade.com/articles/javascript/cookies.xml
    */

    /**
    * Sets a Cookie with the given name and value.
    *
    * name Name of the cookie
    * value Value of the cookie
    * [expires] Expiration date of the cookie (default: end of current session)
    * [path] Path where the cookie is valid (default: path of calling document)
    * [domain] Domain where the cookie is valid
    * (default: domain of calling document)
    * [secure] Boolean value indicating if the cookie transmission requires a
    * secure transmission
    */
    function setCookie(name, value, expires, path, domain, secure)
    {
    document.cookie= name + "=" + escape(value) +
    ((expires) ? "; expires=" + expires.toGMTString() : "") +
    ((path) ? "; path=" + path : "") +
    ((domain) ? "; domain=" + domain : "") +
    ((secure) ? "; secure" : "");
    }

    /**
    * Gets the value of the specified cookie.
    *
    * name Name of the desired cookie.
    *
    * Returns a string containing value of specified cookie,
    * or null if cookie does not exist.
    */
    function getCookie(name)
    {
    var dc = document.cookie;
    var prefix = name + "=";
    var begin = dc.indexOf("; " + prefix);
    if (begin == -1)
    {
    begin = dc.indexOf(prefix);
    if (begin != 0) return null;
    }
    else
    {
    begin += 2;
    }
    var end = document.cookie.indexOf(";", begin);
    if (end == -1)
    {
    end = dc.length;
    }
    return unescape(dc.substring(begin + prefix.length, end));
    }

    /**
    * Deletes the specified cookie.
    *
    * name name of the cookie
    * [path] path of the cookie (must be same as path used to create cookie)
    * [domain] domain of the cookie (must be same as domain used to create cookie)
    */
    function deleteCookie(name, path, domain)
    {
    if (getCookie(name))
    {
    document.cookie = name + "=" +
    ((path) ? "; path=" + path : "") +
    ((domain) ? "; domain=" + domain : "") +
    "; expires=Thu, 01-Jan-70 00:00:01 GMT";
    }
    }


    </script>

  • 相关阅读:
    mysql查询没有主键的表
    pgsql某一个库所有表导出前1000行,CSV格式
    Redis密码设置
    MYSQL PXC
    PXC Percona 5.7 遇到的问题
    ERROR You have enabled the binary log, but you haven't provided the mandatory server-id
    关于js中的比较时遇到的坑
    git 第一次上传本地代码到远程仓库,解决 ! [rejected] master -> master (non-fast-forward)错误
    用css3实现图片的放大缩小
    关于前端使用JavaScript获取base64图片大小的方法
  • 原文地址:https://www.cnblogs.com/y0umer/p/3839357.html
Copyright © 2020-2023  润新知