Question

我有一个表单，用于将用户的First Name发送到数据库中。我正在检查用户使用php中的regex发送的信息。为了使我的项目更具交互性，我决定在将信息发送到PHP之前验证信息jQuery。

我的项目如下：

＆＃13;

<script type="text/javascript" src="jquery-2.2.3.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js" type="text/javascript"></script>

<body>
    <form >
        <div>
            <label>First Name</label>
            <input name="firstname" type="text">
        </div>
        <div>
            <input type="submit">
        </div>
    </form>
</body>
</html>

<script>
    $(document).ready(function() {
        
        $("form").submit(function (e) {
            
            var firstname = $(this).find('input[name="firstname"]').val();

            var regex = /^[A-Za-z0-9 \-']+$/;//Only numbers, Letters, dashes, apostrophes and spaces are accepted
            if(regex.test(firstname)){
                alert('Valid Name.');
            }else{
                alert('Invalid Name.');
                e.PreventDefault();
            }
        });
    });
</script>

＆＃13;

现在我有两个问题：

在将数据存储到数据库之前，是否真的需要再次检查PHP中的First Name？（为了提高安全性）
如何在alert('Valid Name.');？

感谢您提供帮助。

Answer 1

首先要记住，用户输入的验证仅在应用程序的服务器端实现！您无法使用JS在客户端验证输入数据，因为它可以非常轻松地传递（通过禁用javascript或使用Curl等工具）。

但是，您可以在提交表单之前增加用户体验，例如验证输入，或者通知用户忘记填写输入。

要告知用户未填写的输入，您可以使用上面的新html 5属性required

Username: <input type="text" name="usrname" required>

required属性不允许用户提交表单，除非他填写了相关的输入。

此外，您可以使用maxlength属性来解决用例，例如“密码必须包含X个字母。

Password: <input type="password" name="pass" maxlength="8" size="8"><br>

如何在服务器端验证输入

有很多技巧，您可以在Stackoverflow找到所有这些技术。 Ι将引用最高投票的帖子How can I prevent SQL injection in PHP?，它完全回答您的问题。

只有两个子弹压缩了上面的帖子，我建议你另读

始终逃避您的数据
使用mysqli而不是mysql

如何在提醒后立即提交表格（'有效名称。'）;吗

这很容易使用此代码

    <form action="action_page.php" method="post">
    <div>
        <label>First Name</label>
        <input name="firstname" type="text">
    </div>
    <div>
        <input type="submit">
    </div>
</form>

上面的代码将使用POST方法在action_page.php“发送”用户的进程输入，您可以使用$_POST等$firstname = $_POST['fistsname']等超级英雄表来阅读。

Answer 2

尝试这个

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.js" ></script>
     <script type="text/javascript" src="jquery-2.2.3.min.js"></script>
        <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js" type="text/javascript"></script>

    <body>
        <form >
            <div>
                <label>First Name</label>
                <input name="firstname" id="first_name" type="text">
            </div>
            <div>
                <input type="submit">
            </div>
        </form>
    </body>
    </html>

    <script>
    jQuery.validator.addMethod("firstName",function(value,element,param)
    {
  if(this.optional(element))
    {//This is not a 'required' element and the input is empty
      return true;
    }

  if(/^[A-Za-z0-9 \-']+$/.test(value))
    {
      return true;
    }

    return false;

},"Please enter a valid First Name");

$(function()
{
    $('#myform').validate(
      {
      rules:
        { 
          first_name:{ required:true, firstName:true }
        }
      });

});
    </script>

Answer 3

首先，您应该始终验证服务器端的表单提交，特别是如果您将这些值传递给DB-SQL注入，那么斗争是真实的。

至于表单提交流程，你可以......

return true

...在有效名称提醒和正常提交的表单之后。

由于您已经绑定了该提交事件，如果您通过ajax提交表单，并且在服务器验证失败时提供反馈，则对用户来说会更好。因此，用户永远不会离开页面，您可以同时处理客户端和服务器验证。

看看ParsleyJS - http://parsleyjs.org/ - w00t！

在提交表单之前，使用jquery检查$ _POST数据

3 个答案: