前端web加密

1，前端web加密算法--使用js函数escape()和unescape();操作对象字符串；

document.write(escape("Visit W3School!") )

var code=unescape("%61%6C%65%72%74%28%22%u9ED1%u5BA2%u9632%u7EBF%22%29%3B");  
eval(code)  

escape()方法不会对 ASCII 字母和数字进行编码，也不会对下面这些 ASCII 标点符号进行编码： * @ - _ + . / 。其他所有的字符都会被转义序列替换。因为该方法本质就是将非ASCLL码字符替换

unescape()，将ASCLL码解码转换成字符串；

2，前端web加密算法--MD5加密

md5加密很简单，在js中导入MD5.js。然后在js脚本中编写

	var b =$("#logPassword");$.md5(b.val());

但是MD5没有解密算法，或者说解密算法很复杂。所以我们在数据库中存放的密码可能是经过两次MD5加密的字符串

3，base64加密解密

base64既可以加密也可以解密，导入base64.js然后在js脚本中

var b =$("#logPassword");var code = $.encode64(b.val());$.unencode64(code);

===============================================================

加密分为单向和双向。单向是不可逆的，这边加密，那边无法解密；双向加密就是可逆的，这边加密，那边解密后跟数据库里的密码比对。由于加密算法需要发送到浏览器端来执行，因此双向加密对于http的client端来说不可行，最好的办法是单向加密，单向加密最常用的就是做MD5散列。

==============================================================================

密码存储的方式：

密码该如何存储呢？按照安全性由低到高，有这样几种选择：

1.密码名文直接存储在系统中

2.密码经过对称加密后再存储

3.密码经过非对称加密后再存储

===================================================================================

md5加服务器随机数加密

MD5传过去，服务器端把数据库里的密码做MD5后两相比对，等于还是拿POST过去的串原样比对。那我截获MD5串以后，原样POST给server端，不是一样能通过验证？我说，我们可以加点盐（salt），就是在做MD5之前给密码原文加上某个字符串后再做MD5运算。要点在于，这个salt，是每次提交之前跟服务器端实时申请的，而且会在很短的时间内自动过期（因为申请和验证之间的时间间隔只是两次连续http请求的时间，所以这个过期时间可以很短），这个salt只用一次，验证之后无论成功与否都会在服务器端强制作废。这样的话，截获任何一次MD5加密串，都无法用于另一次登录验证。

=======================================================================================

小结：最简单的加密是明文直接加字符串，然后在服务器端去除字符串解密；

最可靠的加密是前端jsmd5+salt加密（非对称加密）

实现

1，没有name的表单不会提交，这样避免密码由用户输入的密码，变成32位"*", 给客户看到

<form action="" method="post" class="form-inline" id="from-test" οnsubmit="return checkInput()">
    <input type="text" id="username" name="username"> 姓名 <br>
    <input type="password" id="password"> 密码 <br>
    <input type="hidden" id="password_md5" name="password">
    <button type="submit">Submitbutton>
form>

function checkInput() {
    var password_input = document.getElementById('password');
    var password_md5 = document.getElementById('password_md5');

    // set password
    password_md5.value =  md5(password_input.value);
    return true;
}

2，使用ajax异步，对表单进行验证

//单击登录
        $('#btn a').click(function () {
            if (!$('#loginName').validatebox('isValid')) {
                $('#loginName').focus();
            } else if (!$('#password').validatebox('isValid')) {
                $('#password').focus();
            } else {
                //md5加密传输
                var salt="{*nbsjt*asar#cdxd#}";
                var pwd=$('#password').val();
                var md5Pwd=$.md5(pwd+salt);
                $.ajax({
                    url:'login.manager',
                    type:'post',
                    data:{
                        loginName:$('#loginName').val(),
                        password:md5Pwd,
                    },
                    beforeSend:function(){
                        $.messager.progress({
                            text:'正在登录中......',
                        });
                    },
                    success:function(data,response,status){
                        $.messager.progress('close');

                        if(data=="success"){
                            location.href = 'main.manager';//进入后台首页
                        }else{
                            $.messager.alert('登录失败！', '用户名或密码错误！', 'warning', function () {
                                $('#password').select();
                            });
                        }
                    }
                });
            }
        });