Community Learn Tools Library Leisure
search
English
Home > List of blog posts > 用户登录及注销
Blogger Information
Blog 47
fans 0
comment 3
visits 44716
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
用户登录及注销
江流
Original
641 people have browsed it

显示用户登录代码 login.html

  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="UTF-8" />
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7.     <title>用户登录</title>
  8.     <style>
  9.       .login {
  10.         width: 480px;
  11.         margin: 0 auto;
  12.         padding: 20px;
  13.         background-color: lightblue;
  14.       }
  15.       form {
  16.         display: grid;
  17.         gap: 0.5rem;
  18.       }
  19.       form * {
  20.         margin: 5px 20px;
  21.       }
  22.       h2 {
  23.         text-align: center;
  24.       }
  25.     </style>
  26.   </head>
  27.   <body>
  28.     <div class="login">
  29.       <h2>用户登录</h2>
  30.       <form action="">
  31.         <fieldset>
  32.           <div>
  33.             <label for="account">账 户：</label>
  34.             <input
  35.               type="text"
  36.               id="account"
  37.               name="account"
  38.               required
  39.               placeholder="请输入用户名"
  40.             />
  41.           </div>
  43.           <div>
  44.             <label for="password">密 码：</label>
  45.             <input
  46.               type="password"
  47.               id="password"
  48.               name="password"
  49.               required
  50.               placeholder="请输入密码"
  51.             />
  52.           </div>
  53.         </fieldset>
  55.         <button type="button" onclick="check(this.form)">登录</button>
  56.       </form>
  57.     </div>
  58.     <script>
  59.       function check(thisForm) {
  60.         const account = thisForm.account.value.trim();
  61.         const password = thisForm.password.value.trim();
  62.         //加密成JSON数据
  63.         const user = JSON.stringify({ account: account, password: password });
  65.         fetch("check.php", { method: "post", body: user })
  66.           .then((response) => response.json())
  67.           .then((json) => {
  68.             if (json.status != 0) {
  69.               alert(json.msg);
  70.               return false;
  71.             }
  72.             alert(json.msg);
  73.             setTimeout(() => {
  74.               window.location.href = "showuser.php";
  75.             }, 1000);
  76.           });
  77.       }
  78.     </script>
  79.   </body>
  80. </html>

  • check.php文件
  1. <?php
  2. require_once "auto.php";
  3. session_start();
  5. header("Content-Type:application/json");
  6. $data=trim(file_get_contents('php://input'));
  7. // json 转为数组
  8. $user=json_decode($data,true);
  9. //
  10. $res=UserContr::login($user['account'],$user['password']);
  11. if($res['stutas']==0){
  12.     setcookie('id',1);
  13.     $_SESSION['account']=$user['account'];
  14. }
  16. echo json_encode($res);
  • UserContr.php文件UserContr类中的用户登录代码
  1.     //用户登录
  2.     public static function login($account,$password){
  3.         $pdo =CreatePDO::Create();
  4.         $sql="SELECT * FROM `php_user` WHERE account='".$account."'";
  6.         $pre=$pdo->prepare($sql);
  7.         $exec=$pre->execute();
  8.         $arr=$pre->fetch();
  10.         if(empty($arr)){
  11.             $res=['status'=>1,'msg'=>'用户不存在'];
  12.         }elseif($arr['password']!=md5($password)){
  13.             $res=['status'=>2,'msg'=>'密码不正确'];
  14.         }else{
  15.             $res=['status'=>0,'msg'=>'登录成功'];
  16.         }
  17.         return $res;
  19.     }
  • header.php 文件
  1. <?php
  2. session_start();
  4. if(empty($_COOKIE['id'])){
  5.     echo "<script>window.location.href='login.html'</script>";
  6.     exit;
  7. }
  8. $account=$_SESSION['account'];
  9. ?>
  10. <div class="header">
  12. <div><span><?=$account?></span> <a href="destroy.php">注销</a>
  13. </div>
  14. </div>
  15. <style>
  16.     *{
  17.         margin: 0;
  18.         padding: 0;
  19.     }
  20.     .header{
  21.         height: 30px;
  22.         background-color: purple;
  23.     }
  24.     .header div{
  25.         width: 15em;
  26.         margin:5px 0px ;
  27.         position: fixed;
  28.         right: 2px;
  29.         color: lightsalmon;
  30.     }
  31.     a{
  32.         text-decoration: none;
  33.     }
  34.     .header a{
  35.         margin:auto 1rem;
  36.         color: #eee;
  37.     }
  38. </style>
  • 在showuser.php文件中引入header.php文件。
  1. <?php require_once "header.php" ?>

  • 注销文件 destroy.php
  1. <?php
  2. setcookie('id',1,time());
  3. $_SESSION['account']=null;
  4. echo '<script>alert("退出登录");location.href="login.html"</script>';
Correcting teacher：PHPzPHPz

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