PHP PDO+MySQL实现登录注册页面

最新推荐文章于 2024-05-29 09:30:01 发布

安静de想着网名

最新推荐文章于 2024-05-29 09:30:01 发布

阅读量1.1w

点赞数 6

分类专栏： web 数据库文章标签： php

本文链接：https://blog.csdn.net/jinmingyi1998/article/details/78102881

版权

web 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

数据库

2 篇文章 0 订阅

订阅专栏

connect.php——连接数据库，以后要连数据库直接include，不用再一写一大堆

<?php
header("Content-type: text/html;charset=utf-8");
$dbh = new PDO("mysql:host=localhost;dbname=DatabaseName", "username", "password");
$dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
?>

login界面

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>LOGIN</title>
<link href="login_css.css" rel="stylesheet" type="text/css">
</head>
<body>
<!-- 用table排版--> 
<table>
    <form name="login" method="post">
            <tr>
                <td >用户名</td>
                <td>
                    <input type="text" name="username">
                </td>
            </tr>
            <tr>
                <td>密码</td>
                <td>
                    <input type="password" name="password"></td>
            </tr>
            <!-- username和password 的输入可以再加一个js来过滤注入数据库 -->
            <tr>
                <td>&nbsp;</td>
                <td>&nbsp;
                    <input type="submit" name="submit" value="submit" width="100%">
                    &nbsp;
                    <input type="reset" value="reset">
                    &nbsp;
                    <input type="button" value="注册" onClick="window.location.href='register.php'">
                    </button></td>
            </tr>
        </form>
    </table>
<?php
    if(isset($_POST["submit"]))//只用submit存在才能执行
    {
        include("conect.php");
        $usr=$_POST["username"];
        $pwd=$_POST["password"];
        //  $_POST[" NAME "]  获取post到php的name="NAME"的值
        //  $_GET[" NAME"]  同上，为get的值
        $cusr=$dbh->query("select username from user where username='$usr';");
        $cpwd=$dbh->query("select username from user where username='$usr' and password='$pwd';");
        //执行查询语句
        $row1=$cusr->fetch(PDO::FETCH_BOTH);
        //$row1为cusr执行后将返回结果转换成行数组格式
        $row2=$cpwd->fetch(PDO::FETCH_BOTH);
        if(empty($row1[0]))//若为空则表示没有匹配到任何条目
        {
            $dbh=null;//断开数据库
        ?>
<script>
            alert ("用户名不存在");
            login.onreset();
            </script>
<?php       
        }
        else if(empty($row2[0]))//同上
        {
            $dbh=null;
        ?>
<script>
            alert ("用户名或密码错误");
            login.onreset();
            </script>
<?php
        }
        else
        {
            $dbh=null;
        ?>
<script>
            alert ("欢迎!  <?php echo $usr;?>");
            window.location.href="home_page";
            </script>
<?php
        }
    }
?>
</body>
</html>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>注册</title>
<script type="text/javascript" src="register_files/register_js.js"></script>
<link href="register_files/register_css.css" rel="stylesheet" type="text/css">
</head>
<body>
    <form onSubmit="return check()" action="" method="post" name="info" >
    <!-- 每个输入都用js正则表达式过滤 -->
        <table>
            <tr>
                <td>*用户名：</td>
                <td><input type="text" name="username" required="required" onChange="check_usr()"></td>
                <td><span>用户名长度6-16位字母数字下划线组合，第一位必须为字母 </span></td>
            </tr>
            <tr>
                <td><span id="usr"> </span></td>
            </tr>
            <tr>
                <td>*密码：</td>
                <td><input type="password" name="password" required="required" onChange="check_pwd()"></td>
                <td><span>密码长度6-16位字母数字下划线 </span></td>
            </tr>
            <tr>
                <td><span id="pwd"> </span></td>
            </tr>
            <tr>
                <td>*再次输入密码</td>
                <td><input type="password" name="password_again" required="required" onChange="check_same()"></td>
                <td><span id="not_same"> </span></td>
            </tr>
            <tr>
                <td>*QQ：</td>
                <td><input type="text" name="qqnum" required="required" onChange="check_qq()"></td>
                <td><span id="qq"> </span></td>
            </tr>
            <tr>
                <td>*姓名：</td>
                <td><input type="text" name="name" required="required" ></td>
                <td><span> </span></td>
            </tr>
            <tr>
                <td></td>
                <td><center>
                        <input type="submit" name="submit" width="100%" value="submit">
                    </center></td>
            </tr>
        </table>
    </form>
<?php
if(isset($_POST["submit"]))
{
    include("connect.php");
    mb_http_input("utf-8");
mb_http_output("utf-8");
    $usr=$_POST["username"];
    $pwd=$_POST["password"];
    $qq=$_POST["qqnum"];
    $name=$_POST["name"];

    $sql = "insert into test.user values('$usr','$pwd',$qq,'$name');";
    $stmt=$dbh->query("select username from user where username='$usr';");
    //执行查询语句
    $row=$stmt->fetch(PDO::FETCH_BOTH);
    if(empty($row[0]))//判断是否存在
    {
        $dbh->exec($sql);
        $dbh = null;
?>
        <script>
        alert ("注册成功！");
        window.location.href="index.php";
        </script>
<?php   
    }
    else
    {
        $dbh = null;
?>
        <script>
        alert ("用户名已存在！");
        </script>
<?php
    }
}
?>
</body>
</html>

注册input检查js

function check()
{
    if(check_usr()&&check_pwd()&&check_same()&&check_qq())
    return true;
    else
    return false;
    //return false就会不执行submit
}
function check_usr()
{
    var x;
    x=document.forms["info"]["username"].value;
    var pat=/^[a-zA-Z]\w{5,15}$/;  //匹配正则表达式
    if(x.search(pat)==-1)
    {
        var txt=document.getElementById("usr").innerHTML;
        txt=txt.replace(txt,"用户名格式错误！");
        document.getElementById("usr").innerHTML=txt;
        return false;
    }
    else
    {
        var txt=document.getElementById("usr").innerHTML;
        txt=txt.replace(txt," ");
        document.getElementById("usr").innerHTML=txt;
        return true;
    }
}
function check_pwd()
{
    var x;
    x=document.forms["info"]["password"].value;
    var pat=/^\w{6,16}$/;
    if(x.search(pat)==-1)
    {
        var txt=document.getElementById("pwd").innerHTML;
        txt=txt.replace(txt,"密码格式不正确！");
        document.getElementById("pwd").innerHTML=txt;
        return false;
    }
    else
    {
        var txt=document.getElementById("pwd").innerHTML;
        var tmp=txt.replace(txt," ");
        document.getElementById("pwd").innerHTML=tmp;
        return true;
    }
}
function check_same()
{
    var x=document.forms["info"]["password"].value;
    var y=document.forms["info"]["password_again"].value;
    //从表中获取input信息
    //document.forms["表单名"]["表单中一项的名"].value;
    if(x!=y)
    {
        var txt=document.getElementById("not_same").innerHTML;
        txt=txt.replace(txt,"两次输入不一致！");
        document.getElementById("not_same").innerHTML=txt;
        return false;
    }
    else
    {
        var txt=document.getElementById("not_same").innerHTML;
        txt=txt.replace(txt," ");
        document.getElementById("not_same").innerHTML=txt;
        return true;
    }
}
function check_qq()
{
    var x;
    x=document.forms["info"]["qqnum"].value;
    pat=/[1-9][0-9]{4,}/;
    if(x.search(pat)==-1)
    {
        var txt=document.getElementById("qq").innerHTML;
        txt=txt.replace(txt,"QQ格式不正确！");
        document.getElementById("qq").innerHTML=txt;
        return false;
    }
    else
    {
        var txt=document.getElementById("qq").innerHTML;
        txt=txt.replace(txt," ");
        document.getElementById("qq").innerHTML=txt;
        return true;
    }
}

html js css php学习笔记

css

@charset "utf-8";
/* CSS Document */
.hhh{
    text-align:center；/*文本对齐方式*/
}
.testone{/*对所有class="testone"的标签应用*/
    color:#D61AF0;
    margin-left:10%;/*缩进*/
}
#one{/*对所有id="one"的标签应用*/
    color:#EF0F13;
}
table{/*对所有table标签应用*/
    width:60%;
}
td{/*对所有td标签应用*/
    text-align: justify;    /*文本的对齐方式*/
}
*{/*对所有标签应用*/
    font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;
    /*font-family  依次使用这些字体，因为不同客户端字体库不同*/
    font-size:xx-large;
    font-style:italic;
    font-weight:bold;
    /*倾斜在font-style 里面，而加粗在font-weight里面*/
}
/*每一条属性后面都要有分号，最后一条可以不需要分号，但是作为习惯还是加上分号好*/

JavaScript

function check()/*定义函数：function 函数名（参数）*/
{
    if(check_usr()&&check_pwd()&&check_same()&&check_qq())
    return true;
    else
    return false;
}
function check_usr()
{
    var x;//声明变量
    x=document.forms["info"]["username"].value;
//  从表单中根据name属性获得值
    var pat=/^[a-zA-Z]\w{5,15}$/;
    //正则表达式
    if(x.search(pat)==-1)
    {
    /*
    在字符串中调用search方法应用正则表达式，返回第一个匹配到的位置，
    如果没匹配到则返回-1
    */
        var txt=document.getElementById("usr").innerHTML;
        /*
        获取id="usr"标签中的内容，变量名为txt
        */
        txt=txt.replace(txt,"用户名格式错误！");
        document.getElementById("usr").innerHTML=txt;
        /*标签id="usr"中的内容变为新的txt*/
        return false;
    }
    else
    {
        var txt=document.getElementById("usr").innerHTML;
        txt=txt.replace(txt," ");
        document.getElementById("usr").innerHTML=txt;
        return true;
    }
}