适当的HTML5表单验证

时间:2017-10-21 18:48:16

标签: javascript forms validation html5-validation

我正在使用HTML5创建一个简单的<form>。只是想确保我没有丢失和安全漏洞。我对攻击知之甚少,但我认为必须有更多的消息字段,因为几乎任何东西都可以输入。我可以仅限于文本,但认为可能不是非常用户友好。

是否有人可以输入任何类型的250个字符?可以做任何有害的事情吗?

<form id="contact_form_id" method="POST" action="" name="contact_form">   
   <input class="contact_single_line" type="text" id="fname" name="fname" minlength="2" maxlength="25" required type="text" onkeypress="return isAlpha(event)"></input>
   <input class="contact_single_line" type="text" id="lname" name="lname" minlength="2" maxlength="25" required type="text" onkeypress="return isAlpha(event)"></input>
   <input class="contact_single_line" type="email" id="email" name="email" minlength="3" maxlength="45" required placeholder="Enter a valid email address" TextMode="email" required data-errormessage-type-mismatch="Invalid!"></input>
   <textarea id="message" name="message" minlength="2" maxlength="250" required></textarea>
   <input type="submit" name="submit" id="contact_submit_btn" value="SUBMIT"></input>
</form>

同样使用这个isalpha函数作为备份。不确定我是否已经使用HTML5验证器

function isAlpha (evt) {
    var theEvent = evt || window.event;
    var key = theEvent.keyCode || theEvent.which;
    key = String.fromCharCode (key);
    var regex = /[A-Za-z_ ]|\./;
    if ( !regex.test(key) ) {
      theEvent.returnValue = false;
      if(theEvent.preventDefault) theEvent.preventDefault();
    }
  }

2 个答案:

答案 0 :(得分:3)

客户端验证(HTML 5或JavaScript)仅用于使访问者的体验更好 - 任何攻击者都可以轻松绕过它。它用于警告访问者在将其提交到服务器之前输入的内容很糟糕。

如果您想担心安全性,那么您需要在服务器端执行此操作,并且它需要与您对数据执行的操作有关。

答案 1 :(得分:2)

限制html表单中的maxlength不会阻止攻击者伪造虚假提交 - 这对发送到服务器的内容没有任何限制。因此,它根本没有安全价值。您必须检查服务器中收到的所有数据,您必须考虑它可能都是危险的。这不是一项微不足道的任务。