html中如何利用会话控制实现页面登录与注销功能
创始人
2024-12-25 11:23:37
0次

首先是一个普通的登陆页面实现

登录页面login.php



    
        登陆页
        
    
    
        

            
                

                    

                        用户登录
                    

                    
                        
                            
                            

                                用户名
                                
                            

                            

                                密码
                                
                            

                            
                                
                                
                            

                            
                                登录
                            
                        
                    

                
            
        
    

登录功能实现action.php

   "cyy",
            "password" => "123456"
        );
    }
    function sendLoginFailedResponse() {
        $response = "";
        echo $response;
        die;
    }
    function rememberLogin($username) {
        setcookie("username", $username, time() + 7 * 24 * 3600);
    }

首页index.php


    
    
        
            主页
            
        
        
            

                
                    
                        使用 Cookie 和 Session 实现会话控制
                    
                    
                        
                            注销
                        
                    
                
                
                    
                        

                            

                                会话控制实战内容一
                            

                            
                                SESSION 部分
                            
                            

                                实现用户认证功能，用户登录、退出与身份识别
                            

                        

                    

                    
                        

                            

                                会话控制实战内容二
                            

                            
                                COOKIE 部分
                            
                            

                                实现登录记住用户功能，七天免登录认证
                            

                        

                    
                
                                                              
                            
                                会话控制实战内容一                             
                                                             SESSION 部分                                                          

                                实现用户认证功能，用户登录、退出与身份识别                             

                        
                    
                                             
                            
                                会话控制实战内容二                             
                                                             COOKIE 部分                                                          

                                实现登录记住用户功能，七天免登录认证                             

                        
                    
                
            
             

接下来是会话控制实例：许愿墙源码

许愿墙首页index.php

  
    
    
        
        许愿墙
        
        
        
    
    
        
            
        
                     ";                         break;                     case 'a2':                         echo "";                         break;                     case 'a3':                         echo "";                         break;                     case 'a4':                         echo "";                         break;                     case 'a5':                         echo "";                         break;                     default:                         echo "";                         break;                 }                 echo "
";                 echo "{$row['name']}";                 echo "No.{$row['id']}";                 echo "
";                 echo "
{$row['content']}
";                 echo "
";                 echo "{$time}";                 echo "";                 echo "
";                 echo "";             }             mysqli_close($connection);             ?>         
                       

添加愿望页面wish.php


    
    
        
        许愿墙
        
        
        
        
            #content {
                width: 638px;
                height:650px;
                margin:0 auto;
                margin-top:100px;
                /*background-color:#F0FAFF;
                border:2px solid #C9F;*/
            }
            #content .c-top{
                width: 638px;
                height: 80px;
                background: url(./Images/content_top.jpg) no-repeat;
            }
            #content .c-bottom{
                width: 638px;
                height: 50px;
                background: url(./Images/content_bottom.jpg) no-repeat;
            }
            .c-content{
                width: 638px;
                height: 470px;
                background: url(./Images/content_bg.jpg) repeat;
            }
            .papercolor{
                width:588px;
                height: 60px;
                margin-left: 35px;
                padding-top:15px;
            }
            .p-left{
                float: left;
                width: 120px;
                line-height: 27px;
            }p-left
            .p-right{
                float: left;            
            }
            .color330{
                float: left;
                margin-left: 20px;
                border-right: #404040 1px solid; 
                border-top: #404040 1px solid;  
                border-left:#404040 1px solid;
                width: 25px;
                cursor: pointer;
                border-bottom: #404040 1px solid;
                height: 25px;
            }
            .papercontent{
                width: 588px;
                height: 210px;
                margin-left: 35px;
            }
            .left{
                width: 294px;
                height:100px;
                float: left;
            }
            .right{
                width: 294px;
                height:100px;
                float: left;
            }
            .left-top{
                margin-bottom: 10px;
            }
            .left-bottom{
            }
            .right-top{
                margin-bottom: 10px;
            }
            .right-bottom{
                width:200px;
                height:150px;
                border: 1px solid orange;
                margin-left:20px;
                background-color:#E8DEFF;
            }
            .name{
                clear: both;
                width: 588px;
                height: 50px;
                margin-left: 35px;
                margin-top:10px;
            }
            .name-left{
                width:60px;
                height: 26px;
                line-height: 26px;
                float: left;
            }
            .name-right{
                float: left;
            }
            .name-right input{
                width: 200px;
                height: 26px;
            }
            .code{
                clear: both;
                width: 588px;
                height: 50px;
                margin-left: 35px;
                margin-top:10px;
            }
            .code-left{
                width:50px;
                height: 26px;
                line-height: 26px;
                float: left;
            }
            .code-content{
                width:100px;
                float: left;
            }
            .code-content input{
                width: 100px;
                height: 26px;
            }
            .code-right{
                float:left;
                margin-left: 10px;
            }
            .code-right input{
                width: 40px;
                height: 26px;
                background-color: pink;
            }
            .submit{
                width:174px;
                height:38px;
                background: url(./Images/pic_submit.gif) no-repeat;
                margin-left:217px;
            }
            .shuname{
                width:80px;
                height:25px;
                margin-left: 120px;
            }
            span{
                font-size: 13px;
                font-family: "微软雅黑";
            }
        
        
    
    
        
        
            

            
                

                    

                        

                            请选择纸条颜色:
                        

                        

                            

                              

                              

                              
                             
                                                
                        
                    
                    

                        

                            

                                输入你的祝福纸条内容:
                            

                            

                                
                            

                        

                        

                            

                                纸条效果预览:
                            

                            

                                第x条

                                 

                                 
署名:
            
                            

                        
                    
                    

                        

                            您的署名:
                        

                        

                            
                        

                    

                    

                        

                            验证码:
                        

                        

                            
                        

                        

                            " readonly>
                        
                
                    

                    
                    
                    
                            
                
            
            

            

        
    
        
            //改变颜色
            $(".color330").click(function(){            
                var value=$(this).css("background-color");
                var idvalue=$(this).attr("id");
                console.log(idvalue);
                $("#idvalue").attr("value",idvalue);
                $(".right-bottom").css("background-color",value);
            })
            //改变值触发的事件
            var textfont = document.getElementById('textfont');
            var font = document.getElementById('font');
            textfont.onchange=function(){
                font.innerHTML=textfont.value;            
            }
            //改变值触发的事件
            var nameright = document.getElementById('nameright');
            nameright.onchange=function(){
                document.getElementById("name").innerText="署名: "+nameright.value;    
            }
            
            //在填写完毕验证码之后验证是否一致
            var codeone = document.getElementById('codeone');
            var codetwo = document.getElementById('codetwo');
            //表单时区焦点事件
            codeone.onblur=function(){
                //验证两次验证码是否一致
                if(codeone.value != codetwo.value){
                    this.nextSibling.innerHTML='验证码不一致!'
                    this.nextSibling.style.color='red';
                }
            }
            $( '#submit' ).click( function () {
                window.location.href="add.php"; 
            } );
                
        
    
    

新增愿望实现add.php

    alert("发布成功！");document.location = "index.php";';
    }else{
        echo '';
    }
    mysqli_close($connection);
    ?>

删除愿望delete.php

    alert("删除成功！");document.location = "index.php";';
    }else{
        echo '';
    }
    mysqli_close($connection);
    ?>

附上数据库结构wall.sql

-- phpMyAdmin SQL Dump
-- version 4.8.5
-- https://www.phpmyadmin.net/
--
-- 主机： localhost
-- 生成日期： 2019-08-18 22:08:38
-- 服务器版本： 8.0.12
-- PHP 版本： 7.3.4
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET AUTOCOMMIT = 0;
START TRANSACTION;
SET time_zone = "+00:00";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;
--
-- 数据库： `wall`
--
-- --------------------------------------------------------
--
-- 表的结构 `wall`
--
CREATE TABLE `wall` (
  `id` tinyint(4) NOT NULL COMMENT '留言编号',
  `content` varchar(200) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '留言内容',
  `name` varchar(20) NOT NULL DEFAULT '匿名的宝宝' COMMENT '署名',
  `wish_time` int(11) NOT NULL COMMENT '留言时间',
  `color` char(2) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '留言背景色'
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
--
-- 转存表中的数据 `wall`
--
INSERT INTO `wall` (`id`, `content`, `name`, `wish_time`, `color`) VALUES
(17, '111', '111', 1566136880, 'a1'),
(19, '333', '333', 1566136894, 'a3'),
(21, '555', '555', 1566136911, 'a5'),
(24, '9999', '9999', 1566137235, 'a4');
--
-- 转储表的索引
--
--
-- 表的索引 `wall`
--
ALTER TABLE `wall`
  ADD PRIMARY KEY (`id`);
--
-- 在导出的表使用AUTO_INCREMENT
--
--
-- 使用表AUTO_INCREMENT `wall`
--
ALTER TABLE `wall`
  MODIFY `id` tinyint(4) NOT NULL AUTO_INCREMENT COMMENT '留言编号', AUTO_INCREMENT=26;
COMMIT;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

上一篇：php cookie与session会话基本用法

下一篇：Redis主从复制的介绍及原理

相关内容

热门资讯

空调连续工作多久需要停机休息 空调连续工作的时间取决于多个因素，包括空调的型号、功率、使用环境和维护情况等。一般来说，空调可以连续...
空调哪个符号是除湿的 空调除湿功能通常用一个水滴形状的符号表示。不同品牌和型号的空调遥控器可能会有所差异，但一般来说，除湿...
格力空调多长时间加一次氟利昂 1、一般情况下，空调对氟利昂的使用量是非常小的，所以在空调使用了四年左右的时候再考虑加也没问题。2、...
空调用多长时间需要加氟一次 一般情况下是五年。当出现以下这几种情况时，空调才需要加氟。1、空调的室内机和室外机各有两个接口，当接...
格调生活·C标思享荟：卡萨帝在... 9月12日的郑州龙湖金融岛，夜风轻拂，灯光璀璨。“C标时刻共传奇——卡萨帝思享荟暨20周年品牌盛典郑...
品牌价值破千亿、高端份额持续领... 9月12日，“C标时刻共传奇——卡萨帝思享荟暨20周年品牌盛典郑州站”在郑州龙湖金融岛举办。2026...
空调主板坏了修800还是换新的 空调主板坏了是修还是换新，需要考虑多个因素，以下是一些建议：1. 维修成本：如果维修费用较低，比如 ...
空调开多久需要休息多长时间 问题：空调开多久需要休息多长时间回答：1、在使用空调的过程中，一般空调开7~8个小时左右需要休息2~...
中央空调多长时间清洗一次 1、一般空调开机前清洗一次即可，空调开机中间时段再清洗一次，空调关机时清洗一次，这样比较合理。2、空...
中央空调氟利昂多久加一次 看空调制热和制冷程度，很多人的观点认为氟利昂必须一年放一次，其实这个观点是错误的，理解上面有点偏差，...