JS校验是什么?

JavaScript015

JS校验是什么?,第1张

JS校验:就是说如果你的操作涉及到服务器或者数据库中修改,删除,添加的动作,那么本着服务器安全的原则,你必须对客户上传的内容进行检查,确保客户上传的是可信赖,可控制,符合规范的内容,以此避免不良客户或者黑客对你的数据库和服务器数据进行窃取,篡改等违法违规的操作!

在web网站的使用中有很多地方会用到上传文件的操作啊,比如上传头像,上传报表并分析报表数据,在多商户类型的网站中,商户需要对自己的商品图片自行上传的,这些都涉及到上传文件的操作.

/*

*@description 校验密码强度的方法

*@param {String} val 待校验强度的密码

*@return {Number} 密码强度等级,数字越大强度越高

*/

function checkPwd(val){

    var res = 2

    // 长度不低于6位和12位,强度分别+1和+2

    res += val.length >= 6 ? 1 : 0

    res += val.length >= 12 ? 2 : 0

    // 包含小写字母,强度+1或+2

    res += /[a-z]/.test(val) ? (val.length <8 || /\d{4}/.test(val) ? 1 : 2) : 0

    // 包含大写字母,强度+1或+2

    res += /[A-Z]/.test(val) ? (val.length <8 || /\d{4}/.test(val) ? 1 : 2) : 0

    // 包含特殊字符,强度+1或+2

    res += /[^a-zA-Z\s\d]/.test(val) ? (val.length <8 || /\d{4}/.test(val) ? 1 : 2) : 0

    return Math.floor(res / 2)

}

思路是img标签中的dynsrc属性。

在FireFox、Chrome浏览器中可以根据document.getElementById(“id_file”).files[0].size 获取上传文件的大小(字节数),而IE浏览器中不支持该属性,只能借助<img>标签的dynsrc属性,来间接实现获取文件的大小(但需要同意ActiveX控件的运行,但是不会引起上面的不友好、不安全的提示)。

参考如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml">  

    <head>  

    <meta name="DEscription" contect="my code demo" />  

    <meta name="Author" contect="Michael@www.micmiu.com" />  

    <meta http-equiv="Content-Type" content="text/html charset=utf-8" />  

    <title>js check file size </title>  

    </head>  

    <body>  

        <img id="tempimg" dynsrc="" src="" style="display:none" />  

        <input type="file" name="file" id="fileuploade" size="40" />  

        <input type="button" name ="check" value="checkfilesize" onclick="checkfile()"/>  

  

    </body>  

    <script type="text/javascript">  

        var maxsize = 2*1024*1024//2M  

        var errMsg = "上传的附件文件不能超过2M!!!"  

        var tipMsg = "您的浏览器暂不支持计算上传文件的大小,确保上传文件不要超过2M,建议使用IE、FireFox、Chrome浏览器。"  

        var  browserCfg = {}  

        var ua = window.navigator.userAgent  

        if (ua.indexOf("MSIE")>=1){  

            browserCfg.ie = true  

        }else if(ua.indexOf("Firefox")>=1){  

            browserCfg.firefox = true  

        }else if(ua.indexOf("Chrome")>=1){  

            browserCfg.chrome = true  

        }  

        function checkfile(){  

            try{  

                var obj_file = document.getElementById("fileuploade")  

                if(obj_file.value==""){  

                    alert("请先选择上传文件")  

                    return  

                }  

                var filesize = 0  

                if(browserCfg.firefox || browserCfg.chrome ){  

                    filesize = obj_file.files[0].size  

                }else if(browserCfg.ie){  

                    var obj_img = document.getElementById('tempimg')  

                    obj_img.dynsrc=obj_file.value  

                    filesize = obj_img.fileSize  

                }else{  

                    alert(tipMsg)  

                return  

                }  

                if(filesize==-1){  

                    alert(tipMsg)  

                    return  

                }else if(filesize>maxsize){  

                    alert(errMsg)  

                    return  

                }else{  

                    alert("文件大小符合要求")  

                    return  

                }  

            }catch(e){  

                alert(e)  

            }  

        }  

    </script>  

</html>