简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > List of blog posts > 服务端 - PHP - 会话控制之Session实现
Blogger Information
Blog 33
fans 0
comment 0
visits 27674
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
服务端 - PHP - 会话控制之Session实现
郴
Original
663 people have browsed it

服务端 - PHP - 会话控制之Session实现

一、目录结构

  1. ├─WWW                  应用目录
  2. │  ├─user              用户模块
  3. │  │  ├─login.php      登录页面  
  4. │  │  └─register.php   注册页面
  5. │  │
  6. │  ├─css               样式目录
  7. │  │  ├─index.css      首页样式
  8. │  │  ├─login.css      登录页面样式
  9. │  │  └─register.css   注册页面样式
  10. │  │
  11. │  ├─index.php         首页
  12. │  ├─handle.php        控制器

二、实现

1. index.php & index.css

  1. <?php
  2. //开启会话
  3. session_start();
  4. //判断是否登录
  5. if (isset($_SESSION['user'])) {
  6.     //如果已登录则取出SESSIONID
  7.     $un = $_SESSION['user'];
  8. }
  9. ?>
  11. <!DOCTYPE html>
  12. <html lang="zh_hans">
  13. <head>
  14.     <meta charset="UTF-8">
  15.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  16.     <title>首页</title>
  17.     <link rel="stylesheet" href="css\index.css">
  18. </head>
  19. <body>
  20.     <nav>
  21.         <span class="l-nav">
  22.             <ul>
  23.                 <li><a href="#">首页</a></li>
  24.                 <li><a href="#">文章</a></li>
  25.                 <li><a href="#">资料</a></li>
  26.                 <li><a href="#">关于</a></li>
  27.             </ul>
  28.         </span>
  29.         <span class="r-nav">
  30.             <?php
  31.                 //如果已登录的话显示用户名和退出按钮
  32.                 if (isset($un)):
  33.             ?>
  34.             <span style="color: yellow;font-size: larger;font-weight: bolder;line-height: 40px;"><?php echo $un?></span>
  35.             <a href="" id="logout">
  36.             退出
  37.             </a>
  38.             <?php
  39.                 //否则显示登录按钮
  40.                 else:
  41.             ?>
  42.             <a href="\user\login.php" id="login">登录</a>
  43.             <?php endif ?>
  44.         </span>
  45.     </nav>
  46.     <script>
  47.         //为退出按钮创建一个事件，点击它会让其跳转到退出事件处理器
  48.         document.querySelector('#logout').addEventListener('click', function(event) {
  49.             //弹出对话框
  50.             if (confirm('是否退出')) {
  51.                 //取消默认行为, 其实就是禁用原<a>标签的点击跳转行为,使用事件中的自定义方法处理
  52.                 event.preventDefault();
  53.                 //跳转到退出事件处理器
  54.                 window.location.assign('handle.php?action=logout');
  55.             }
  56.         });
  57.     </script>
  59. </body>
  60. </html>
  1. * {
  2.     margin: 0;
  3.     padding: 0;
  4.     box-sizing: border-box;
  5. }
  6. a {
  7.     color: white;
  8.     font-size: larger;
  9.     font-weight: bolder;
  10.     text-decoration: none;
  11. }
  12. nav {
  13.     width: 100%;
  14.     height: 40px;
  15.     background-color: black;
  16.     display: flex;
  17.     justify-content: space-between;
  18.     align-items: center;
  19. }
  20. .l-nav > ul {
  21.     display: flex;
  22.     list-style: none;
  23. }
  24. .l-nav > ul > li {
  25.     width: 100px;
  26.     height: 40px;
  27. }
  28. .l-nav > ul > li > a {
  29.     width: 100%;
  30.     height: 100%;
  31.     margin-left: 20px;
  32.     display: flex;
  33.     justify-content: center;
  34.     align-items: center;
  35. }
  36. .l-nav > ul > li > a:hover {
  37.     color: #303;
  38.     background-color: yellow;
  39. }
  40. .r-nav {
  41.     display: flex;
  42.     justify-content: space-between;
  43.     width: 150px;
  44.     height: 40px;
  45.     margin-right: 20px;
  46. }
  47. .r-nav > a {
  48.     width: 100px;
  49.     height: 100%;
  50.     display: flex;
  51.     justify-content: center;
  52.     align-items: center;
  53. }
  54. .r-nav > a:hover {
  55.     color: #303;
  56.     background-color: yellow;
  57. }



2. login.php & login.css

  1. <?php
  2. //开启会话
  3. session_start();
  4. //判断是否登录
  5. if (isset($_SESSION['user'])) {
  6.     //如果已登录则输出请勿重复登录的信息并返回首页
  7.     exit('<script>alert("请勿重复登录");location.href="/index.php"</script>');
  8. }
  9. ?>
  11. <!DOCTYPE html>
  12. <html lang="zh_hans">
  13. <head>
  14.     <meta charset="UTF-8">
  15.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  16.     <title>登录页</title>
  17.     <link rel="stylesheet" href="\css\login.css">
  18. </head>
  19. <body>
  20.     <h2>登录表单</h2>
  21.     <div class="f-box">
  22.         <form action="..\handle.php?action=login" method="POST">
  23.             <fieldset>
  24.                 <div class="e-box">
  25.                     <label for="email">邮箱：</label>
  26.                     <input type="email" name="email" id="email" require autofocus autocomplete="on">
  27.                 </div>
  28.                 <div class="p-box">
  29.                     <label for="password">密码：</label>
  30.                     <input type="password" name="password" id="password" require>
  31.                 </div>
  32.                 <div class="s-box">
  33.                     <button type="submit">提交</button>
  34.                 </div>
  35.                 <div class="o-box">
  36.                     <!--链接到注册页-->
  37.                     <a href="register.php">还没有账户？注册一个吧！</a>
  38.                 </div>
  39.             </fieldset>
  40.         </form>
  41.     </div>
  42. </body>
  43. </html>
  1. * {
  2.     margin: 0;
  3.     padding: 0;
  4.     box-sizing: border-box;
  5. }
  6. a {
  7.     color: black;
  8.     text-decoration: none;
  9. }
  10. h2 {
  11.     width: 300px;
  12.     height: 40px;
  13.     margin: 10px auto 0 auto;
  14.     text-align: center;
  15.     line-height: 40px;
  16. }
  17. .f-box {
  18.     width: 400px;
  19.     height: 500px;
  20.     margin: 20px auto;
  21. }
  22. .e-box {
  23.     width: 300px;
  24.     height: 30px;
  25.     margin: 25px auto 0 auto;
  26. }
  27. .e-box input {
  28.     width: 240px;
  29.     height: 100%;
  30. }
  31. .p-box {
  32.     width: 300px;
  33.     height: 30px;
  34.     margin: 10px auto;
  35. }
  36. .p-box input {
  37.     width: 240px;
  38.     height: 100%;
  39. }
  40. .s-box {
  41.     width: 300px;
  42.     height: 30px;
  43.     margin: 0 auto;
  44. }
  45. .s-box button {
  46.     width: 100%;
  47.     height: 100%;
  48. }
  49. .s-box button:hover {
  50.     background-color: lightyellow;
  51. }
  52. .o-box {
  53.     width: 200px;
  54.     margin: 10px auto 30px auto;
  55. }

3. register.php & register.css

  1. <?php
  2. //开启会话
  3. session_start();
  4. //判断是否登录
  5. if (isset($_SESSION['user'])) {
  6.     //如果已登录则输出请勿重复登录的信息并返回首页
  7.     exit('<script>alert("请勿重复登录");location.href="/index.php"</script>');
  8. }
  9. ?>
  11. <!DOCTYPE html>
  12. <html lang="zh_hans">
  13. <head>
  14.     <meta charset="UTF-8">
  15.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  16.     <title>注册页</title>
  17.     <link rel="stylesheet" href="\css\register.css">
  18. </head>
  19. <body>
  20. <h2>注册表单</h2>
  21.     <div class="f-box">
  22.         <!--给一个提交验证，如果验证失败中止提交-->
  23.         <form action="..\handle.php?action=register" method="POST" onsubmit="return compare()">
  24.             <fieldset>
  25.                 <div class="d-box">
  26.                     <label for="username">姓名：</label>
  27.                     <input type="text" name="username" id="username" required autofocus autocomplete="on">
  28.                 </div>
  29.                 <div class="d-box">
  30.                     <label for="email">邮箱：</label>
  31.                     <input type="email" name="email" id="email" required autocomplete="on">
  32.                 </div>
  33.                 <div class="d-box">
  34.                     <label for="p1">密码：</label>
  35.                     <input type="password" name="p1" id="p1" required>
  36.                 </div>
  37.                 <div class="d-box">
  38.                     <label for="p2">重复：</label>
  39.                     <input type="password" name="p2" id="p2" required>
  40.                 </div>
  41.                 <div class="d-box">
  42.                     <button type="submit">提交</button>
  43.                 </div>
  44.                 <div class="d-box">
  45.                     <a href="login.php">已有账号？直接登录！</a>
  46.                 </div>
  47.             </fieldset>
  48.         </form>
  49.     </div>
  50.     <script>
  51.         //验证二次密码是否相等
  52.         function compare() {
  53.             if (document.forms[0].p1.value.trim() !== document.forms[0].p2.value.trim()) {
  54.                 window.alert('二次密码不相等');
  55.                 return false;
  56.             };
  57.         }
  58.     </script>
  59. </body>
  60. </html>
  1. * {
  2.     margin: 0;
  3.     padding: 0;
  4.     box-sizing: border-box;
  5. }
  6. a {
  7.     color: black;
  8.     text-decoration: none;
  9. }
  10. h2 {
  11.     width: 300px;
  12.     height: 40px;
  13.     margin: 10px auto 0 auto;
  14.     text-align: center;
  15.     line-height: 40px;
  16. }
  17. .f-box {
  18.     width: 400px;
  19.     height: 600px;
  20.     margin: 20px auto;
  21. }
  22. .d-box:nth-of-type(1) {
  23.     width: 300px;
  24.     height: 30px;
  25.     margin: 25px auto 0 auto;
  26. }
  27. .d-box:nth-of-type(1) input {
  28.     width: 240px;
  29.     height: 100%;
  30. }
  31. .d-box:nth-of-type(2) {
  32.     width: 300px;
  33.     height: 30px;
  34.     margin: 10px auto;
  35. }
  36. .d-box:nth-of-type(2) input {
  37.     width: 240px;
  38.     height: 100%;
  39. }
  40. .d-box:nth-of-type(3) {
  41.     width: 300px;
  42.     height: 30px;
  43.     margin: 10px auto;
  44. }
  45. .d-box:nth-of-type(3) input {
  46.     width: 240px;
  47.     height: 100%;
  48. }
  49. .d-box:nth-of-type(4) {
  50.     width: 300px;
  51.     height: 30px;
  52.     margin: 10px auto;
  53. }
  54. .d-box:nth-of-type(4) input {
  55.     width: 240px;
  56.     height: 100%;
  57. }
  58. .d-box:nth-of-type(5) {
  59.     width: 300px;
  60.     height: 30px;
  61.     margin: 0 auto;
  62. }
  63. .d-box:nth-of-type(5) button {
  64.     width: 100%;
  65.     height: 100%;
  66. }
  67. .d-box:nth-of-type(5) button:hover {
  68.     background-color: lightyellow;
  69. }
  70. .d-box:nth-of-type(6) {
  71.     width: 200px;
  72.     margin: 10px auto 30px auto;
  73. }

4. handle.php

  1. <?php
  2. //开启会话
  3. session_start();
  4. //1. 获取表中用户名、邮箱和密码字段数据
  5. $pdo = new PDO('mysql:host=localhost;dbname=shopping', 'root', 'root');
  6. $stmt = $pdo->prepare('SELECT `user_name`, `email`, `passwd` FROM `userinfo`');
  7. $stmt->execute();
  8. $t_data = $stmt->fetchAll(PDO::FETCH_ASSOC);
  10. //2. 处理用户登录、退出与注册
  11. //获取请求参数值并根据其来使用对应的方法进行处理
  12. $action = $_GET['action'];
  13. switch (strtolower($action)) {
  14.     //2.1 登录
  15.     case 'login':
  16.         //判断请求是否合法
  17.         if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  18.             //获取从前端传过来的数据
  19.             $f_email = $_POST['email'];
  20.             $f_passwd = md5($_POST['password']);
  21.             //与后台数据进行校验并获取
  22.             $results = array_filter($t_data, function($user) use ($f_email, $f_passwd) {
  23.                 return $user['email'] === $f_email && $user['passwd'] === $f_passwd;
  24.             });
  25.             //如果有记录证明校验成功并在服务端设置SESSIONID
  26.             if (count($results) === 1) {
  27.                 $user_v = (current($results))['user_name'];
  28.                 $_SESSION['user'] = $user_v;
  29.                 //校验通过并设置好SESSIONID后退出当前页面返回首页
  30.                 exit('<script>alert("验证通过");location.href="index.php"</script>');
  31.             } else {
  32.                 //校验不通过输出错误信息后返回当前页面
  33.                 exit('<script>alert("邮箱或密码错误，或者还未注册账户");location.href="user/login.php"</script>');
  34.             }
  35.         } else {
  36.             die('请求类型错误');
  37.         }
  38.     break;
  39.     //2.2 退出
  40.     case 'logout':
  41.         //判断是否登录，已登录则清除SESSIONID并返回首页
  42.         if (isset($_SESSION['user'])) {
  43.             session_destroy();
  44.             exit('<script>alert("退出成功");location.href="/index.php"</script>');
  45.         }
  46.     break;
  47.     //2.3 注册
  48.     case 'register':
  49.         //获取从前端传过来的数据
  50.         $username = $_POST['username'];
  51.         $email = $_POST['email'];
  52.         $pwd = md5($_POST['p1']);
  53.         //定义非空字段数据
  54.         $reg_time = time();
  55.         //将新用户数据插入到表中
  56.         $sql = "INSERT `userinfo` SET `user_name`='{$username}', `passwd`='{$pwd}', `email`='{$email}', `reg_time`='{$reg_time}'";
  57.         $stmt = $pdo->prepare($sql);
  58.         $stmt->execute();
  59.         //判断是否插入成功
  60.         if ($stmt->rowCount() === 1) {
  61.             //插入成功代表注册成功并返回至登录页面
  62.             exit('<script>alert("注册成功");location.href="user/login.php"</script>');
  63.         } else {
  64.             //注册失败输出错误信息后返回当前页面
  65.             exit('<script>alert("注册失败");location.href="user/register.php"</script>');
  66.         }
  67.     break;
  69.     //未定义
  70.     default:
  71.         exit('未定义操作');
  72. }

三、课程总结

  • 今天学习了 PHP 的会话控制，通过上课认真听讲和认真完成老师布置的作业，使得我对 PHP 会话控制的理解和运用更加深入和熟悉。最主要的知识点是明白和掌握了Session的特点以及Session方式实现会话控制的基本用法。
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！