欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

用户登录及注销

程序员文章站 2022-03-24 09:37:06
...

显示用户登录代码 login.html

    

  1. <!DOCTYPE html>
    2. 

  2. <html lang="en">
    3. 

  3.   <head>
    4. 

  4.     <meta charset="UTF-8" />
    5. 

  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    6. 

  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    7. 

  7.     <title>用户登录</title>
    8. 

  8.     <style>
    9. 

  9.       .login {
    10. 

  10.         width: 480px;
    11. 

  11.         margin: 0 auto;
    12. 

  12.         padding: 20px;
    13. 

  13.         background-color: lightblue;
    14. 

  14.       }
    15. 

  15.       form {
    16. 

  16.         display: grid;
    17. 

  17.         gap: 0.5rem;
    18. 

  18.       }
    19. 

  19.       form * {
    20. 

  20.         margin: 5px 20px;
    21. 

  21.       }
    22. 

  22.       h2 {
    23. 

  23.         text-align: center;
    24. 

  24.       }
    25. 

  25.     </style>
    26. 

  26.   </head>
    27. 

  27.   <body>
    28. 

  28.     <div class="login">
    29. 

  29.       <h2>用户登录</h2>
    30. 

  30.       <form action="">
    31. 

  31.         <fieldset>
    32. 

  32.           <div>
    33. 

  33.             <label for="account">账 户：</label>
    34. 

  34.             <input
    35. 

  35.               type="text"
    36. 

  36.               id="account"
    37. 

  37.               name="account"
    38. 

  38.               required
    39. 

  39.               placeholder="请输入用户名"
    40. 

  40.             />
    41. 

  41.           </div>
    42. 

    43. 

  43.           <div>
    44. 

  44.             <label for="password">密 码：</label>
    45. 

  45.             <input
    46. 

  46.               type="password"
    47. 

  47.               id="password"
    48. 

  48.               name="password"
    49. 

  49.               required
    50. 

  50.               placeholder="请输入密码"
    51. 

  51.             />
    52. 

  52.           </div>
    53. 

  53.         </fieldset>
    54. 

    55. 

  55.         <button type="button" onclick="check(this.form)">登录</button>
    56. 

  56.       </form>
    57. 

  57.     </div>
    58. 

  58.     <script>
    59. 

  59.       function check(thisForm) {
    60. 

  60.         const account = thisForm.account.value.trim();
    61. 

  61.         const password = thisForm.password.value.trim();
    62. 

  62.         //加密成JSON数据
    63. 

  63.         const user = JSON.stringify({ account: account, password: password });
    64. 

    65. 

  65.         fetch("check.php", { method: "post", body: user })
    66. 

  66.           .then((response) => response.json())
    67. 

  67.           .then((json) => {
    68. 

  68.             if (json.status != 0) {
    69. 

  69.               alert(json.msg);
    70. 

  70.               return false;
    71. 

  71.             }
    72. 

  72.             alert(json.msg);
    73. 

  73.             setTimeout(() => {
    74. 

  74.               window.location.href = "showuser.php";
    75. 

  75.             }, 1000);
    76. 

  76.           });
    77. 

  77.       }
    78. 

  78.     </script>
    79. 

  79.   </body>
    80. 

  80. </html>
    81.

用户登录及注销

  • check.php文件
    

  1. <?php
    2. 

  2. require_once "auto.php";
    3. 

  3. session_start();
    4. 

    5. 

  5. header("Content-Type:application/json");
    6. 

  6. $data=trim(file_get_contents('php://input'));
    7. 

  7. // json 转为数组
    8. 

  8. $user=json_decode($data,true);
    9. 

  9. //
    10. 

  10. $res=UserContr::login($user['account'],$user['password']);
    11. 

  11. if($res['stutas']==0){
    12. 

  12.     setcookie('id',1);
    13. 

  13.     $_SESSION['account']=$user['account'];
    14. 

  14. }
    15. 

    16. 

  16. echo json_encode($res);
    17.
  • UserContr.php文件UserContr类中的用户登录代码
    

  1.     //用户登录
    2. 

  2.     public static function login($account,$password){
    3. 

  3.         $pdo =CreatePDO::Create();
    4. 

  4.         $sql="SELECT * FROM `php_user` WHERE account='".$account."'";
    5. 

    6. 

  6.         $pre=$pdo->prepare($sql);
    7. 

  7.         $exec=$pre->execute();
    8. 

  8.         $arr=$pre->fetch();
    9. 

    10. 

  10.         if(empty($arr)){
    11. 

  11.             $res=['status'=>1,'msg'=>'用户不存在'];
    12. 

  12.         }elseif($arr['password']!=md5($password)){
    13. 

  13.             $res=['status'=>2,'msg'=>'密码不正确'];
    14. 

  14.         }else{
    15. 

  15.             $res=['status'=>0,'msg'=>'登录成功'];
    16. 

  16.         }
    17. 

  17.         return $res;
    18. 

    19. 

  19.     }
    20.
  • header.php 文件
    

  1. <?php
    2. 

  2. session_start();
    3. 

    4. 

  4. if(empty($_COOKIE['id'])){
    5. 

  5.     echo "<script>window.location.href='login.html'</script>";
    6. 

  6.     exit;
    7. 

  7. }
    8. 

  8. $account=$_SESSION['account'];
    9. 

  9. ?>
    10. 

  10. <div class="header">
    11. 

    12. 

  12. <div><span><?=$account?></span> <a href="destroy.php">注销</a>
    13. 

  13. </div>
    14. 

  14. </div>
    15. 

  15. <style>
    16. 

  16.     *{
    17. 

  17.         margin: 0;
    18. 

  18.         padding: 0;
    19. 

  19.     }
    20. 

  20.     .header{
    21. 

  21.         height: 30px;
    22. 

  22.         background-color: purple;
    23. 

  23.     }
    24. 

  24.     .header div{
    25. 

  25.         width: 15em;
    26. 

  26.         margin:5px 0px ;
    27. 

  27.         position: fixed;
    28. 

  28.         right: 2px;
    29. 

  29.         color: lightsalmon;
    30. 

  30.     }
    31. 

  31.     a{
    32. 

  32.         text-decoration: none;
    33. 

  33.     }
    34. 

  34.     .header a{
    35. 

  35.         margin:auto 1rem;
    36. 

  36.         color: #eee;
    37. 

  37.     }
    38. 

  38. </style>
    39.
  • 在showuser.php文件中引入header.php文件。
  1. <?php require_once "header.php" ?>

用户登录及注销

  • 注销文件 destroy.php
    

  1. <?php
    2. 

  2. setcookie('id',1,time());
    3. 

  3. $_SESSION['account']=null;
    4. 

  4. echo '<script>alert("退出登录");location.href="login.html"</script>';
    5.

上一篇： css怎么实现文字循环滚动效果

下一篇： 创建商城项目数据库表

推荐阅读