[PHP從小白到大牛]-028 PHP-商城項目(四)

時間  2019-11-08
標籤 php 從小 商城 項目 欄目 PHP 简体版
原文   原文鏈接

前臺用戶註冊

  • 建立login.php
  • C:\Users\xujunhao\Desktop\shop\backend\shop\login.php
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <title>雲和商城</title>
    <meta name="description" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <!-- Place favicon.ico in the root directory -->
    <link rel="apple-touch-icon" href="apple-touch-icon.png" />
    <!-- All css files are included here. -->
    <!-- Bootstrap fremwork main css -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css" />
    <!-- Owl Carousel main css -->
    <link rel="stylesheet" href="assets/css/owl.carousel.min.css" />
    <link rel="stylesheet" href="assets/css/owl.theme.default.min.css" />
    <!-- This core.css file contents all plugings css file. -->
    <link rel="stylesheet" href="assets/css/core.css" />
    <!-- Theme shortcodes/elements style -->
    <link rel="stylesheet" href="assets/css/shortcode/shortcodes.css" />
    <!-- Theme main style -->
    <link rel="stylesheet" href="assets/css/style.css" />
    <!-- Responsive css -->
    <link rel="stylesheet" href="assets/css/responsive.css" />
    <!-- User style -->
    <link rel="stylesheet" href="assets/css/custom.css" />
    <!-- Modernizr JS -->
    <script src="assets/js/vendor/modernizr-2.8.3.min.js"></script>
  </head>
  <body>
    <input type="hidden" name="current_action" />
    <!-- Body main wrapper start -->
    <div class="wrapper fixed__footer">
      <!-- Start Header Style -->
      <header id="header" class="htc-header header--3 bg__white">
        <!-- Start Mainmenu Area -->
        <div id="sticky-header-with-topbar" class="mainmenu__area sticky__header" >
          <div class="container">
            <div class="row">
              <div class="col-md-2 col-lg-2 col-sm-3 col-xs-3">
                <div class="logo">
                  <a href="index.html">
                    <img src="assets/images/logo/logo.png" alt="logo" />
                  </a>
                </div>
              </div>
              <!-- Start MAinmenu Ares -->
              <!-- End MAinmenu Ares -->
            </div>
          </div>
        </div>
        <!-- End Mainmenu Area -->
      </header>
      <!-- End Header Style -->
      <div class="body__overlay"></div>
      <!-- Start Offset Wrapper -->
      <div class="offset__wrapper">
        <!-- Start Offset MEnu -->
        <div class="offsetmenu">
          <div class="offsetmenu__inner">
            <div class="offsetmenu__close__btn">
              <a href="#"><i class="zmdi zmdi-close"></i></a>
            </div>
            <div class="off__contact">
              <div class="logo">
                <a href="index.html">
                  <img src="assets/images/logo/logo.png" alt="logo" />
                </a>
              </div>
            </div>
          </div>
        </div>
        <!-- End Offset MEnu -->
      </div>
      <!-- End Offset Wrapper -->
      <!-- Start Login Register Area -->
      <div class="htc__login__register bg__white ptb--130">
        <div class="container">
          <div class="row">
            <div class="col-md-6 col-md-offset-3">
              <ul class="login__register__menu" role="tablist">
                <li role="presentation" class="login active">
                  <a href="#login" role="tab" data-toggle="tab">登陸</a>
                </li>
                <li role="presentation" class="register">
                  <a href="#register" role="tab" data-toggle="tab">註冊</a>
                </li>
              </ul>
            </div>
          </div>
          <!-- Start Login Register Content -->
          <div class="row">
            <div class="col-md-6 col-md-offset-3">
              <div class="htc__login__register__wrap">
                <!-- Start Single Content -->
                <div id="login" role="tabpanel" class="single__tabs__panel tab-pane fade in active" >
                  <form class="login" method="post">
                    <input type="hidden" name="action" value="login" />
                    <input type="text" name="username" placeholder="User Name*" />
                    <input type="password" name="password" placeholder="Password*" />
                  </form>
                  <div class="htc__login__btn mt--30">
                    <a href="javascript:document.querySelector('#login form').submit();" >登陸</a >
                  </div>
                </div>
                <!-- End Single Content -->
                <!-- Start Single Content -->
                <div id="register" role="tabpanel" class="single__tabs__panel tab-pane fade" >
                  <form class="login" method="post">
                    <input type="hidden" name="action" value="register" />
                    <input type="text" name="username" placeholder="Name*" />
                    <input type="email" name="email" placeholder="Email*" />
                    <input type="password" name="password" placeholder="Password*" />
                  </form>
                  <div class="htc__login__btn">
                    <a href="javascript:document.querySelector('#register form').submit();" >註冊</a >
                  </div>
                </div>
                <!-- End Single Content -->
              </div>
            </div>
          </div>
          <!-- End Login Register Content -->
        </div>
      </div>
      <!-- End Login Register Area -->
      <div class="only-banner ptb--10 bg__white"></div>
      <!-- Start Footer Area -->
      <footer class="htc__foooter__area gray-bg">
        <div class="container"></div>
      </footer>
      <!-- End Footer Area -->
    </div>
    <!-- Body main wrapper end -->
    <!-- Placed js at the end of the document so the pages load faster -->
    <!-- jquery latest version -->
    <script src="assets/js/vendor/jquery-1.12.0.min.js"></script>
    <!-- Bootstrap framework js -->
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- All js plugins included in this file. -->
    <script src="assets/js/plugins.js"></script>
    <script src="assets/js/slick.min.js"></script>
    <script src="assets/js/owl.carousel.min.js"></script>
    <!-- Waypoints.min.js. -->
    <script src="assets/js/waypoints.min.js"></script>
    <!-- Main js file that contents all jQuery plugins activation. -->
    <script src="assets/js/main.js"></script>
  </body>
</html>
複製代碼
  • 由於登陸和註冊在一個頁面, 因此, 咱們須要判斷是登陸, 仍是註冊
  • 能夠使用隱藏域, 指明動做的目的
<input type="hidden" name="action" value="register">
複製代碼
  • 由於註冊和登陸時a標籤, 因此, 咱們還須要爲點擊事件賦予submit功能
<div id="register" role="tabpanel" class="single__tabs__panel tab-pane fade">
  <form class="login" method="post">
    <input type="hidden" name="action" value="register" />
    <input value="<?php if(isset($_POST['username'])) echo $_POST['username']; ?>" type="text" name="username" placeholder="Name*" />
    <input value="<?php if(isset($_POST['username'])) echo $_POST['email']; ?>" type="email" name="email" placeholder="Email*" />
    <input type="password" name="password" placeholder="Password*" />
  </form>
  <div class="htc__login__btn">
    <a href="javascript:document.querySelector('#register form').submit();">註冊</a>
  </div>
</div>
複製代碼
  • 從新加載頁面, 默認是登陸頁面, 因此咱們還須要寫一個js來模擬鼠標點擊註冊的動做
<script> window.onload = function() { var action = document.querySelector("input[name=current_action]").value; switch (action) { case "login": document.querySelector('a[href="#login"]').click(); break; case "register": document.querySelector('a[href="#register"]').click(); break; } }; </script>
複製代碼
  • 書寫php邏輯代碼
<?php
// 引入文件
require_once "../tools.func.php";
require_once "../db.func.php";
// 獲取表前綴
$prefix = getDBPrefix();
// 登陸邏輯
if (!empty($_POST) && $_POST['action'] == 'login') {
    $rules = [
        'username' => [
            'name' => '用戶名',
            'require' => true,
        ],
        'password' => [
            'name' => '登陸密碼',
            'require' => true,
        ],
    ];
    if (check_form($_POST, $rules)) {
        $username = $_POST['username'];
        $password = md5('yunhe_' . md5($_POST['password']));
        $sql = "select id,name,username from {$prefix}user where username = '$username' and password = '$password'";
        if ($result = queryOne($sql)) {
            setSession('user', $result, 'shop');
            header('location:index.php');
        } else {
            setInfo('用戶名或密碼不正確!!!');
        }
    }
}
// 註冊邏輯
if (!empty($_POST) && $_POST['action'] == 'register') {
    $rules = [
        'username' => [
            'name' => '用戶名',
            'require' => true,
            'is_unique' => "select id from {$prefix}user where username = '{$_POST['username']}'",
        ],
        'email' => [
            'name' => '郵箱',
            'require' => true,
            'type' => 'email',
            'is_unique' => "select id from {$prefix}user where email = '{$_POST['email']}'",
        ],
        'password' => [
            'name' => '密碼',
            'require' => true,
        ],
    ];
    if (check_form($_POST, $rules)) {
        $username = $_POST['username'];
        $password = md5('yunhe_' . md5($_POST['password']));
        $email = $_POST['email'];
        $created_at = date('Y-m-d H:i:s');
        $sql = "INSERT INTO `{$prefix}user`(`username`, `password`, `email`, `created_at`) VALUES ('{$username}', '{$password}', '{$email}', '{$created_at}')";
        if ($result = execute($sql)) {
            setInfo('註冊成功!');
            header('location:login.php');
        } else {
            setInfo('註冊失敗!!!');
        }
    }
}
?>
複製代碼

用戶退出

C:\Users\xujunhao\Desktop\shop\backend\shop\logout.phpjavascript

<?php
require_once "../tools.func.php";
// 清除session
deleteSession('user', 'shop');
// 退出登陸時, 返回退出時的網頁
echo "<script>history.go(-1);</script>";
複製代碼
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程