简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > List of blog posts > 使用cookie与session来实现用户登录、注册、验证
Blogger Information
Blog 24
fans 0
comment 0
visits 18489
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
使用cookie与session来实现用户登录、注册、验证
昔年
Original
2449 people have browsed it

cookie实现用户登录、注册、验证

1.用户登录页面

1.1html代码

  1. <?php
  2. //判断是否已经登录
  3. if (isset($_COOKIE['user']))
  4.     exit('<script>alert("请不要重复登录");location.href="index.php"</script>');
  5. ?>
  7. <!DOCTYPE html>
  8. <html lang="en">
  10. <head>
  11.     <meta charset="UTF-8">
  12.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  13.     <link rel="stylesheet" type="text/css" href="../css/style.css">
  14.     <title>用户登录</title>
  15. </head>
  17. <body>
  18.     <h3>用户登录</h3>
  19.     <form action="handle.php?action=login" method="post">
  20.         <div>
  21.             <label for="email">邮箱:</label>
  22.             <input type="email" name="email" id="email" placeholder="email@php.cn" autofocus required>
  23.         </div>
  24.         <div>
  25.             <label for="password">密码:</label>
  26.             <input type="password" name="password" id="password" placeholder="密码不少于6位" required>
  27.         </div>
  28.         <div>
  29.             <button>点击登录</button>
  30.         </div>
  32.     </form>
  33.     <a href="register.php">还没有账号，注册一个吧</a>
  34. </body>
  36. </html>

1.2 css代码

  1. body {
  2.   display: flex;
  3.   flex-direction: column;
  4.   text-align: center;
  5.   color: #555;
  6.   font-weight: 300;
  7. }
  8. body h3 {
  9.   font-weight: 300;
  10.   font-size: 20px;
  11.   margin-bottom: 10px;
  12. }
  13. body form {
  14.   width: 250px;
  15.   padding: 20px;
  16.   box-sizing: border-box;
  17.   margin: auto;
  18.   border-radius: 5px;
  19.   box-shadow: 0 0 5px #aaa;
  20. }
  21. body form > div {
  22.   height: 36px;
  23.   display: flex;
  24.   justify-content: space-between;
  25.   align-items: center;
  26. }
  27. body form div > label {
  28.   width: 50px;
  29. }
  30. body form div:last-of-type {
  31.   display: flex;
  32.   justify-content: center;
  33. }
  34. body form input:hover {
  35.   box-shadow: 0 0 5px #aaa;
  36. }
  37. body form button {
  38.   flex: auto;
  39.   height: 30px;
  40.   background-color: green;
  41.   color: white;
  42.   border: none;
  43.   outline: none;
  44. }
  45. body form button:hover {
  46.   background-color: lightcoral;
  47.   cursor: pointer;
  48.   box-shadow: 0 0 5px #aaa;
  49. }
  50. body a {
  51.   color: #888;
  52.   text-decoration: none;
  53.   margin-top: 15px;
  54. }
  55. body a:hover {
  56.   color: lightcoral;
  57.   font-weight: bold;
  58. }

2.用户注册

2.1html代码

  1. <!DOCTYPE html>
  2. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <link rel="stylesheet" href="../css/style.css">
  8.     <title>用户注册</title>
  9. </head>
  11. <body>
  12.     <h3>用户注册</h3>
  13.     <form action="handle.php?action=register" method="post" onsubmit="return compare()">
  14.         <div>
  15.             <label for="name">昵称:</label>
  16.             <input type="text" name="name" id="name" placeholder="不少于3个字符" required autofocus>
  17.         </div>
  19.         <div>
  20.             <label for="email">邮箱:</label>
  21.             <input type="email" name="email" id="email" placeholder="demo@php.cn" required>
  22.         </div>
  24.         <div>
  25.             <label for="p1">密码:</label>
  26.             <input type="password" name="p1" id="p1" placeholder="密码不少6个字符" required>
  27.         </div>
  29.         <div>
  30.             <label for="p2">重复:</label></label>
  31.             <input type="password" name="p2" id="p2" placeholder="必须和上面的密码一样" required>
  32.         </div>
  34.         <div>
  35.             <button>提交</button><span id="tips" style="color:red"></span>
  36.         </div>
  37.     </form>
  38.     <a href="login.php">我有账号，直接登录</a>
  39.     <script>
  40.         //严重二次密码是否相等?
  41.         function compare() {
  42.             if (document.forms[0].p1.value.trim() !== document.forms[0].p2.value.trim()) {
  43.                 document.querySelector('#tips').innerText = '二次密码不相等';
  44.                 return false;
  45.             }
  46.         }
  47.     </script>
  48. </body>
  50. </html>

2.2 css代码

同上面的用户登录

3 登录成功

3.1用户首页

  1. <?php
  2. if (isset($_COOKIE['user'])) $user = unserialize($_COOKIE['user']);
  3. // var_dump($user);
  4. // die;
  5. ?>
  6. <!DOCTYPE html>
  7. <html lang="en">
  9. <head>
  10.     <meta charset="UTF-8">
  11.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  12.     <title>首页</title>
  13. </head>
  15. <body>
  16.     <nav>
  17.         <a href="index.php">我的论坛</a>
  18.         <?php if (isset($user)) : ?>
  19.             <a href="" id="logout"><span style="color:red"><?php echo $user['name'] ?> </span>  退出</a>
  20.         <?php else : ?>
  21.             <a href="login.php">登录</a>
  22.         <?php endif; ?>
  23.     </nav>
  25.     <script>
  26.         //为按钮创建事件监听器
  27.         document.querySelector('#logout').addEventListener('click', function(event) {
  28.             if (confirm('是否退出')) {
  29.                 //禁用默认行为，其实就是禁用原<a>标签的点击跳转行为，使用事件的自定义方法处理
  30.                 event.preventDefault();
  31.                 //跳转到退出事件处理器
  32.                 window.location.assign('handle.php?action=logout');
  33.             }
  34.         });
  35.     </script>
  36. </body>
  38. </html>

3.1 css样式

  1. nav {
  2.   height: 40px;
  3.   background-color: deepskyblue;
  4.   padding: 0 20px;
  5.   display: flex;
  6.   justify-content: space-between;
  7.   align-items: center;
  8. }
  10. nav > a {
  11.   color: white;
  12.   text-decoration: none;
  13. }

4 控制部分

  1. <?php
  2. //查询用户表中的数据
  3. $pdo = new PDO('mysql:host=localhost;dbname=phpedu', 'root', 'root');
  4. $stmt = $pdo->prepare("select * from users");
  5. $stmt->execute();
  6. $users = $stmt->fetchAll(PDO::FETCH_ASSOC);
  8. //处理用户登录与注册
  9. $action = $_GET['action'];
  10. switch (strtolower($action)) {
  11.     case 'login':
  12.         //判断请求是否合法
  13.         if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  14.             //获取需要验证的数据
  15.             $email = $_POST['email'];
  16.             $password = sha1($_POST['password']);
  17.             //使用array_filter来验证数据库中是否存在此用户
  18.             $results = array_filter($users, function ($user) use ($email, $password) {
  19.                 return $user['email'] === $email && $user['password'] === $password;
  20.             });
  21.             if (count($results) == 1) {
  22.                 setcookie('user', serialize(array_pop($results)));
  23.                 exit('<script>alert("验证通过");location.href="index.php"</script>');
  24.             } else {
  25.                 exit('<script>alert("邮箱或密码错误,或者还没有帐号");location.href="login.php"</script>');
  26.             }
  27.         } else {
  28.             die('用户类型错误');
  29.         }
  31.     case 'logout':
  32.         if (isset($_COOKIE['user'])) {
  33.             setcookie('user', null, time() - 1);
  34.             exit('<script>alert("退出成功");location.assign("index.php")</script>');
  35.         }
  37.         break;
  39.     case 'register':
  40.         //1.获取到新用户注册数据
  41.         $name = $_POST['name'];
  42.         $email = $_POST['email'];
  43.         $password = sha1($_POST['p1']);
  44.         $register_time = time();
  46.         //2.将新用户插入到表中
  47.         $sql = "INSERT `users` SET `name`='{$name}',`email`='{$email}',`password`='{$password}',`register_time`={$register_time}";
  48.         // var_dump($sql);
  49.         // exit;
  50.         $stmt = $pdo->prepare($sql);
  51.         $stmt->execute();
  52.         if ($stmt->rowCount() === 1) exit('<script>alert("注册成功");location.assign("login.php")</script>');
  53.         else exit('<script>alert("注册失败");location.assign("register.php")</script>');
  54.         break;
  55.     default:
  56.         exit('未定义操作');
  57. }

总结：用户登录注册通过把控制处理代码统一写在一个模块，这个就是MVC中的控制器，通过控制来处理这些逻辑，用户是看不到这个部分代码的
session实现只需要把用到cookie的部分替换成session，然后在代码前面加上session_start()就可以实现了

Correcting teacher：天蓬老师天蓬老师

Correction status：qualified

Teacher's comments：这个登录验证, 是不是写起来很舒服?
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！