简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Home
Article
Q&A
Course
Topic
Download
Game
Dictionary
Recent Updates

博客列表 >会话控制与实战

会话控制与实战

溪边小树
溪边小树原创
2020年05月27日 16:19:31674浏览

1. 会话控制

  • HTTP 是基于无连接的网络协议, 每一次访问, 对于服务器来说, 都是全新的
  • 如果记住访问者,以及记录连接状态, 可以提升用户体验,完成许多个性化的功能
  • 例如, 用户登录, 购物车等
  • 其实让服务器记住用户的方式很简单, 就和生活中, 我们办会员卡是一样的
  • 会员卡的存储位置有二个地方, 要么放在你身上, 要么保存到商家电脑中
  • 所以, 网络中的用户资料也会保存在二个地方: 浏览器(客户端)和服务器中
  • 保存到浏览器中的叫: cookie
  • 保存到服务器中的叫: session
  • 保存在客户端
  • 变量: $_COOKIE
  • 变量过滤器: filter_input(INPUT_COOKIE, key)
  • 设置使用专用函数: setcookie(名称, 值, 过期时间)
  • 生效需要分二步完成: 先下达指令到浏览器, 再由浏览器完成 cookie 写入

3. SESSION

  • 保存在服务器端
  • 变量: $_SESSION
  • 变量过滤器: filter_input(INPUT_SESSION, key)
  • 设置使用专用函数: setcookie(名称, 值, 过期时间)
  • 生效需要分二步完成: 先下达指令到浏览器, 再由浏览器完成 cookie 写入

示例演示

  1. <?php
  2. session_start();
  3. // cookie
  4. // 设置: 由服务器设置到浏览器, 理解成商城给用户发了一个会员卡
  5. setcookie('username', 'perter-zhu', time()+60, '/');
  7. // 查询
  8. echo $_COOKIE['username'];
  10. // 更新
  11. $_COOKIE['username'] = 'admin';
  12. setcookie('username', 'admin', time()+60, '/');
  13. echo $_COOKIE['username'];
  15. // 删除
  16. setcookie('username', null, time()-60, '/');
  18. echo $_SESSION['email'];
  20. --------------------------------------------
  22. // session: 会话, 将客户端信息保存到服务器上
  23. // 向用户发会员卡, 启动一个会话
  24. session_start();
  25. // 1. 给浏览器发一个id用来标识用户:session_id(), PHPSESSID
  26. // 2. 在服务器上指定位置保存与用户id对应的用户信息
  28. // sess_ku7neaha636g69t4mq0atj6d2i
  29. //      ku7neaha636g69t4mq0atj6d2i
  31. $_SESSION['email'] ='admin@php.cn';
  32. $_SESSION['password'] = sha1(md5('1234567'). 'php.cn123');
  33. $_SESSION['email'] ='peter@php.cn';
  36. session_destroy();
  38. setcookie('PHPSESSID', '', time()-123456);

Cookie方式的用户登陆

index.php

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

login.php

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

register.php

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

handle.php

  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'];
  11. switch ( strtolower($action)) {
  12.     // 登录
  13.     case 'login':
  14.         // 判断请求是否合t法
  15.         if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  16.             // 获取需要验证的数据
  17.             $email = $_POST['email'];
  18.             $password = sha1($_POST['password']);
  20.             $results = array_filter($users, function($user) use ($email, $password) {
  21.                 return $user['email'] === $email && $user['password'] === $password;
  22.              });
  24.              if (count($results) === 1) {
  25.                  setcookie('user', serialize(array_pop($results)));
  26.                  exit('<script>alert("验证通过");location.href="index.php"</script>');
  27.              } else {
  28.                 exit('<script>alert("邮箱或密码错误,或者还没有帐号");location.href="login.php";</script>'); 
  29.              }
  30.         } else {
  31.             die('请求类型错误');
  32.         }
  33.     break;
  35.     // 退出
  36.     case 'logout':
  37.         if (isset($_COOKIE['user'])) {
  38.             setcookie('user', null , time()-3600);
  39.             exit('<script>alert("退出成功");location.assign("index.php")</script>');
  40.         }
  41.     break;
  43.     // 注册
  44.     case 'register':
  45.         // 1. 获取到所有新用户数据
  46.         $name = $_POST['name'];
  47.         $email = $_POST['email'];
  48.         $password = sha1($_POST['p1']);
  49.         $register_time = time();
  51.         // 2. 将新用户插入到表中
  52.         $sql = "INSERT  `users` SET `name`='{$name}', `email`='{$email}', `password`='{$password}', `register_time`={$register_time}";
  53.         $stmt = $pdo->prepare($sql);
  54.         $stmt->execute();
  55.         if ($stmt->rowCount() === 1) exit('<script>alert("注册成功");location.assign("login.php")</script>');
  56.         else exit('<script>alert("注册失败");location.assign("login.php")</script>');
  57.         break;
  59.     // 未定义
  60.     default:
  61.     exit('未定义操作');
  62. }

index.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. }

style.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: 220px;
  15.   padding: 20px;
  16.   box-sizing: border-box;
  17.   background-color: skyblue;
  18.   margin: auto;
  19.   border-radius: 5px;
  20.   box-shadow: 0 0 5px #aaa;
  21. }
  22. body form > div {
  23.   height: 36px;
  24.   display: flex;
  25.   justify-content: space-between;
  26.   align-items: center;
  27. }
  28. body form div:last-of-type {
  29.   display: flex;
  30.   justify-content: center;
  31. }
  32. body form input {
  33.   border: none;
  34.   outline: none;
  35.   padding-left: 5px;
  36.   height: 20px;
  37. }
  38. body form input:hover {
  39.   box-shadow: 0 0 5px #aaa;
  40. }
  41. body form button {
  42.   flex: auto;
  43.   height: 30px;
  44.   background-color: green;
  45.   color: white;
  46.   border: none;
  47.   outline: none;
  48. }
  49. body form button:hover {
  50.   background-color: lightcoral;
  51.   cursor: pointer;
  52.   box-shadow: 0 0 5px #aaa;
  53. }
  54. body a {
  55.   color: #888;
  56.   text-decoration: none;
  57.   margin-top: 15px;
  58. }
  59. body a:hover {
  60.   color: lightcoral;
  61.   font-weight: bold;
  62. }

Session方式的用户登陆

index.php

  1. <?php
  2. // 开启会话
  3. session_start();
  5. // 判断是否已经登录?
  6. if (isset($_SESSION['user'])) $user = unserialize($_SESSION['user']);
  8. ?>
  10. <!DOCTYPE html>
  11. <html lang="en">
  12. <head>
  13.     <meta charset="UTF-8">
  14.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  15.     <link rel="stylesheet" type="text/css" href="../css/index.css">
  16.     <title>首页</title>
  17. </head>
  18. <body>
  19.     <nav>
  20.         <a href="index.php">我的论坛</a>
  22.         <?php if (isset($user)) : ?>
  23.             <a href="" id="logout"><span style="color:red"><?php echo $user['name']?></span>&nbsp;&nbsp;退出</a>
  24.         <?php else: ?>
  25.         <a href="login.php">登录</a>
  26.         <?php endif ?>
  30.     </nav>
  31. </body>
  33. <script>
  34.     //        为退出按钮创建事件监听器
  35. document.querySelector('#logout').addEventListener('click', function(event) {
  36.     if (confirm('是否退出')) {
  37.         // 禁用默认行为, 其实就是禁用原<a>标签的点击跳转行为,使用事件中的自定义方法处理
  38.         event.preventDefault();
  39.         // 跳转到退出事件处理器
  40.         window.location.assign('handle.php?action=logout');
  41.     }
  42. });
  43. </script>
  44. </html>

login.php

  1. <?php
  2. // 开启会话
  3. session_start();
  5. // 判断是否已登录
  6. if (isset($_SESSION['user']))
  7.     exit('<script>alert("请不要重复登录");location.href="index.php";</script>');
  8. ?>
  9. <!DOCTYPE html>
  10. <html lang="en">
  12. <head>
  13.     <meta charset="UTF-8">
  14.     <title>用户登录</title>
  15.     <link rel="stylesheet" type="text/css" href="../css/style.css">
  16. </head>
  18. <body>
  19.     <h3>用户登录</h3>
  20.     <form action="handle.php?action=login" method="post">
  21.         <div>
  22.             <label for="email">邮箱:</label>
  23.             <input type="email" name="email" id="email" placeholder="demo@email.com" required autofocus>
  24.         </div>
  26.         <div>
  27.             <label for="password">密码:</label>
  28.             <input type="password" name="password" id="password" placeholder="不少于6位" required>
  29.         </div>
  31.         <div>
  32.             <button>提交</button>
  33.         </div>
  34.     </form>
  35.     <a href="register.php">还没有帐号, 注册一个吧</a>
  36. </body>
  38. </html>

register.php

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

handle.php

  1. <?php
  2. // 开启会话
  3. session_start();
  4. // 查询用户表中的数据
  5. $pdo = new PDO('mysql:host=localhost;dbname=phpedu', 'root', 'root');
  6. $stmt = $pdo->prepare('SELECT * FROM `users`');
  7. $stmt->execute();
  8. $users = $stmt->fetchAll(PDO::FETCH_ASSOC);
  10. // 处理用户登录与注册
  11. $action = $_GET['action'];
  13. switch ( strtolower($action)) {
  14.     // 登录
  15.     case 'login':
  16.         // 判断请求是否合t法
  17.         if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  18.             // 获取需要验证的数据
  19.             $email = $_POST['email'];
  20.             $password = sha1($_POST['password']);
  22.             $results = array_filter($users, function($user) use ($email, $password) {
  23.                 return $user['email'] === $email && $user['password'] === $password;
  24.              });
  26.              if (count($results) === 1) {
  27.                  $_SESSION['user'] = serialize(array_pop($results));
  28.                  exit('<script>alert("验证通过");location.href="index.php"</script>');
  29.              } else {
  30.                 exit('<script>alert("邮箱或密码错误,或者还没有帐号");location.href="login.php";</script>'); 
  31.              }
  32.         } else {
  33.             die('请求类型错误');
  34.         }
  35.     break;
  37.     // 退出
  38.     case 'logout':
  39.         if (isset($_SESSION['user'])) {
  40.             session_destroy();
  41.             exit('<script>alert("退出成功");location.assign("index.php")</script>');
  42.         }
  43.     break;
  45.     // 注册
  46.     case 'register':
  47.         // 1. 获取到所有新用户数据
  48.         $name = $_POST['name'];
  49.         $email = $_POST['email'];
  50.         $password = sha1($_POST['p1']);
  51.         $register_time = time();
  53.         // 2. 将新用户插入到表中
  54.         $sql = "INSERT  `users` SET `name`='{$name}', `email`='{$email}', `password`='{$password}', `register_time`={$register_time}";
  55.         $stmt = $pdo->prepare($sql);
  56.         $stmt->execute();
  57.         if ($stmt->rowCount() === 1) exit('<script>alert("注册成功");location.assign("login.php")</script>');
  58.         else exit('<script>alert("注册失败");location.assign("login.php")</script>');
  59.         break;
  61.     // 未定义
  62.     default:
  63.     exit('未定义操作');
  64. }
  68. index.css
  70. ```css
  71. nav {
  72.   height: 40px;
  73.   background-color: deepskyblue;
  74.   padding: 0 20px;
  75.   display: flex;
  76.   justify-content: space-between;
  77.   align-items: center;
  78. }
  80. nav > a {
  81.   color: white;
  82.   text-decoration: none;
  83. }

style.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: 220px;
  15.   padding: 20px;
  16.   box-sizing: border-box;
  17.   background-color: skyblue;
  18.   margin: auto;
  19.   border-radius: 5px;
  20.   box-shadow: 0 0 5px #aaa;
  21. }
  22. body form > div {
  23.   height: 36px;
  24.   display: flex;
  25.   justify-content: space-between;
  26.   align-items: center;
  27. }
  28. body form div:last-of-type {
  29.   display: flex;
  30.   justify-content: center;
  31. }
  32. body form input {
  33.   border: none;
  34.   outline: none;
  35.   padding-left: 5px;
  36.   height: 20px;
  37. }
  38. body form input:hover {
  39.   box-shadow: 0 0 5px #aaa;
  40. }
  41. body form button {
  42.   flex: auto;
  43.   height: 30px;
  44.   background-color: green;
  45.   color: white;
  46.   border: none;
  47.   outline: none;
  48. }
  49. body form button:hover {
  50.   background-color: lightcoral;
  51.   cursor: pointer;
  52.   box-shadow: 0 0 5px #aaa;
  53. }
  54. body a {
  55.   color: #888;
  56.   text-decoration: none;
  57.   margin-top: 15px;
  58. }
  59. body a:hover {
  60.   color: lightcoral;
  61.   font-weight: bold;
  62. }

课程学习小结

本次课程老师讲解非常细致，在老师的直播讲解之后，又通过回看视频进行理解消化，并在老师的课堂案例中实操了每一段代码予以加深理解，对用户登陆处理环节有了比较完整的认识，对以前不太敢看的整段代码，能够认真地看完并基本理解，有一定的进步。
复习过程中对本次课程中关于会话控制相关原理知识要点做了整理：Cookie：服务器端设置、保存在客户端的一个小变量，用来标识访问者的身份，是针对浏览器的，它不认识你是张三还是李四，它只认识你用的是什么样的访问代理，就是你用的是什么样的浏览器，它通过识别浏览器来识别当前访问用户是不是已经访问过了，如果你是第二次来，那我读一下看里面有没有Cookie，有的话就把它取出来，取到之后就知道你是否已经登录了，根据Cookie的值来进行判断，这就是一个典型的会话过程。Cookie类似于超市会员卡，实际卡片保存在用户手中（浏览器端），但随着发展，如果是电子卡包或只报手机号，就变成了存在商家手中（服务器端），这就是Session了。我们一般所说的会话控制，主要指的是Session，由服务器端设置，保存在服务器端。

上一条：JS-实战小案例下一条：JS选项卡与轮播图实战
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多