演示一个最简单的JavaScript客户端验证的漏洞

很多时候我们都有JavaScript在客户端做验证,比如必填选项,格式验证等,如果不合法则不让表单提交。但是对于重要的信息如果不在服务器端再做一次验证,是很有风险的。下面的简单示例证明了这一点。

HTML文件如下,页面上有两个文本输入框,一个的id是name,一个id是sechole。JavaScript在客户端对name做检查,简单起见,这里的验证规则是必须填值。验证通过后提交到服务器端的一个servlet。

 

  1. <!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
  2. <html>
  3. <head>
  4. <meta http-equiv=”Content-Type” content=”text/html; charset=ISO-8859-1″>
  5. <title>js security hole</title>
  6. <script language=’javascript’>
  7.     function checkInput(){
  8.     var name = document.getElementById(“name”);
  9.     if(name.value.length==0){
  10.         alert(“name invalid”);
  11.         return false;
  12.     }
  13.     return true;
  14. }
  15. </script>
  16. </head>
  17. <body>
  18. <form action=”xxx.test”  method=”post” onsubmit=”return checkInput();”>
  19.     <label  for=”name”>name</label><input id=”name” name=”name” type=”text”><br>
  20.     <label for=”sechole”>security hole</label><input id=”sechole” name=”sechole” type=”text”>
  21.     <br>
  22.     <input type=”submit” value=”submit”>
  23. </form>
  24. </body>
  25. </html>

通过浏览器的一些插件,如firefox的firebug,将sechole的id改为name,将name的id改为别的值,则可以”骗”过浏览器的JS验证。如下图,name的输入框没有填值,在security hole的框里填上值,则可以通过验证,并且成功提交。

 

 

标签