时间戳

首页 > 解决方案 > 如何使 JavaScript 注册验证与 example.php 文件一起使用？

javascript - 如何使 JavaScript 注册验证与 example.php 文件一起使用？

问题描述

我已经设置了一个 MySQL 数据库来维护登录和注册数据。现在我想为我的注册表单编写 javascript 验证

我对 Javascript 和 ajax 验证做了一些研究。我的理解是，出于安全原因，您可以在服务器端同时进行 javascript 和 ajax 验证。但是也可以只进行 js 验证？

我的 register.php 看起来像这样：

<html>
<head>
    <title>Register</title>
    <script src="script.js"></script>

</head>
<body>
    <br>
    <form action="register.php" method="post" id="form" name="form">

        <table width="35%">
            <tr>
                <td>Name</td>


                <td><input type="text" name="name" ></td>
                <div id="username_error"></div>


            </tr>
            <tr>
                <td>Email</td>


                <td><input type="email" name="email"  ></td>
                <div id="email_error"></div>

            </tr>

            <td>Password</td>


            <td><input type="password" name="password" ></td>
            <div id="password_error"></div>
            </tr>

            <tr>
                <td></td>
                <td><input type="submit" value="Register" onSubmit="myFunction()"></td>
    
            </tr>
        </table>
        <a href="login.php">Login</a>

这行代码只是我用来显示错误消息的试验：

<div id="username_error"></div>
<div id="email_error"></div>
<div id="password_error"></div>

这是我的 script.js

let name = document.querySelector("#name")
let email = document.querySelector("#email")
let password = document.querySelector("#password")
let passVal = '?=.*\d)(?=.*[a-z])(?=.*[A-Z]'
let emailVal = '^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/'

function myFunction() {
    if(name == ""){
        alert ( "Please fill in the 'Your Name' box." );

    }
    if(email == emailVal){
        alert ( "Please fill in the 'Your Name' box." );

    }
    if(password == passVal){
        alert ( "Please fill in the 'Your Name' box." );

    }
}

Register.php 和 script.js 似乎不能一起工作。我相信我的设置是正确的： <td><input type="submit" value="Register" onSubmit="myFunction()"></td>但不确定。

如何实现我的 script.js 以使用 register.php？

标签： javascriptphpajaxvalidation

解决方案

回答你的最后一个问题：不。您不能只在客户端上进行 JS 验证。永远不要相信客户给你的数据。即使是业余“黑客”也很容易绕过 JS 检查并提交他们想要的任何数据。

需要在两端进行验证（在 UX 客户端和服务器上，以确保没有任何危险通过）。

您的函数不起作用的原因是页面加载时正在设置变量（名称、电子邮件等）。您需要在函数内部设置变量，如下所示：

function myFunction() {
    let name = document.querySelector("#name")
    let email = document.querySelector("#email")
    let password = document.querySelector("#password")
    let passVal = '?=.*\d)(?=.*[a-z])(?=.*[A-Z]'
    let emailVal = '^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/'

    if(name == ""){
        alert ( "Please fill in the 'Your Name' box." );

    }
    if(email == emailVal){
        alert ( "Please fill in the 'Your Name' box." );

    }
    if(password == passVal){
        alert ( "Please fill in the 'Your Name' box." );

    }
}

在您的 register.php 文件的顶部，您需要检查$_POST数据，并在其中验证它。那是服务器端检查。确保您对收到的所有数据进行转义，以确保您免受恶意注入的侵害。

推荐阅读