PHP学习编程艺术Web前端之路

[实战项目]PHP实现登录注册之表单登录功能

2017-09-12  本文已影响671人  头场雪

就剩一个登陆了,把这个小demo写完整。为了不会把新手带偏,这里在登录里我就不涉及session与cookie了,虽然很简单,但是对于新人来说还是有点晕的,感兴趣的可以自行了解一下。

实现登录

登录界面

登录界面我们把注册界面拿过来用一用,修改一下提交地址和按钮名称就行了。
<html>
<head>
    <meta charset="UTF-8">
    <title>Register</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <style>
        body {
          padding-top: 40px;
          padding-bottom: 40px;
          background-color: #eee;
        }

        .form-signin {
          max-width: 330px;
          padding: 15px;
          margin: 0 auto;
        }
    </style>
</head>
<body>
        <div class="container">
      <form class="form-signin" action="doAction.php?action=login" method="post">
        <h2 class="form-signin-heading">Please sign up</h2>
        <label for="inputEmail" class="sr-only">Email address</label>
        <br>
        <input type="email" name="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
        <br>
        <label for="inputPassword" class="sr-only">Password</label>
        <input type="password" name="password" id="inputPassword" class="form-control" placeholder="Password" required>
        <br>
         <input type="submit" class="btn btn-lg btn-primary btn-block" type="submit" value="Sign up">
      </form>
    </div>
</body>
</html>

PHP登录逻辑实现主要代码

    $sql = "select email,password from users where email='%s'";
    $formatted = sprintf($sql, $data['email']);
    $result = mysqli_query($handle, $formatted);
    $res = mysqli_fetch_assoc($result);
    if(!$res){
        echo "<script>alert('无此用户!')</script>";
        echo "<script>window.location.href='login.html'</script>";
    }
    // 此处应注意的是数据库的密码是摘要后的,无法还原的
    // 所以我们对比密码的方法就是把提交过来的密码也进行摘要
    // 然后两个密码做对比,相同的话登录到首页
    if ($data['password'] == $res['password']) {
        // 核对邮件和密码无误后登录到首页
        echo "<script>alert('登录成功!')</script>";
        echo "<script>window.location.href='home.html'</script>";
    }else{
        echo "<script>alert('密码错误!')</script>";
        echo "<script>window.location.href='login.html'</script>";
    }

PHP注册登录完整代码

<?php
/**
 * 配置数据库信息
 */
define('host', '127.0.0.1');
define('user', 'root');
define('passwd', '');
define('dbName', 'artist_demo');
$handle = mysqli_connect(host, user, passwd, dbName);
if (!$handle) {
    die('连接数据库失败!' . mysqli_connect_error());
}

$action = $_GET['action']; // 获取get过来的action行为参数
if (!$action) {
    // 如果没有该参数,跳转到登录页面
    echo "<script>window.location.href='login.html'</script>";
}
// 如果行为参数为register我们继续进行下面的操作
$email = $_POST['email'];
$password = $_POST['password'];
// trim()函数去除两边空白
// stripcslashes()去除转义字符
// htmlspecialchars()把一些预定义的字符转换为 HTML 实体
// md5()数据摘要(习惯上称为加密,但是md5()实际上不是加密,而是摘要)
$data['email'] = htmlspecialchars(stripcslashes(trim($email)));
$data['password'] = md5($password);
if ($action == 'register') {
    $sql = "insert into users (email, password) values('%s', '%s')";
    $formatted = sprintf($sql, $data['email'], $data['password']);
    echo '打印刚才执行的SQL语句:' . '<br>' . $formatted . '<br>';
    $result = mysqli_query($handle, $formatted);
    echo $result ? '注册成功!' : '注册失败!';
}elseif ($action == 'login') {
    $sql = "select email,password from users where email='%s'";
    $formatted = sprintf($sql, $data['email']);
    $result = mysqli_query($handle, $formatted);
    $res = mysqli_fetch_assoc($result);
    if(!$res){
        echo "<script>alert('无此用户!')</script>";
        echo "<script>window.location.href='login.html'</script>";
    }
    // 此处应注意的是数据库的密码是摘要后的,无法还原的
    // 所以我们对比密码的方法就是把提交过来的密码也进行摘要
    // 然后两个密码做对比,相同的话登录到首页
    if ($data['password'] == $res['password']) {
        // 核对邮件和密码无误后登录到首页
        echo "<script>alert('登录成功!')</script>";
        echo "<script>window.location.href='home.html'</script>";
    }else{
        echo "<script>alert('密码错误!')</script>";
        echo "<script>window.location.href='login.html'</script>";
    }
}

image.png

顺便附上首页代码

<html>
<head>
    <meta charset="UTF-8">
    <title>Register</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<body>
    <div class="container jumbotron">
      <h1>Hello, world!</h1>
      <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
      <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
    </div>
</body>
</html>
image.png
上一篇下一篇

猜你喜欢

热点阅读