首先是一个普通的登陆页面实现
登录页面login.php
<!doctype html><html> <head> <title>登陆页</title> <link rel="stylesheet" href="/d/file/titlepic/bootstrap.min.css" integrity="sha384-mcw98/sfnge8fjt3gxweongsv7zt27nxfoaoapmym81iuxopkfojwj8erdknlpmo" crossorigin="anonymous"> </head> <body> <div class="container"> <div class="card col-12 mt-5"> <div class="card-body"> <h4 class="card-title"> 用户登录 </h4> <div class="col-12 mt-4 d-flex justify-content-center"> <form class="col-8" method="post" action="action.php"> <input type="hidden" name="action" value="login"> <div class="form-group"> <label for="urname">用户名</label> <input type="text" class="form-control" id="urname" name="urname" placeholder="请输入用户名"> </div> <div class="form-group"> <label for="password">密码</label> <input type="password" class="form-control" id="password" name="password" placeholder="请输入密码"> </div> <div class="form-group form-check"> <input type="checkbox" class="form-check-input" id="remember" name="remember"> <label class="form-check-label" for="remember"> 在这台电脑上记住我的登录状态 </label> </div> <button type="submit" class="btn btn-primary"> 登录 </button> </form> </div> </div> 大学自习课 </div> </div> </body></html>
登录功能实现action.php
<?php ssion_start(); switch ($_request['action']) { ca 'login': $urname = $_post['urname']; $password = $_post['password']; $remember = $_post['remember']; $ur = getur(); if ($urname != $ur['urname']) { // 登录失败 ndloginfailedrespon(); } if ($password != $ur['password']) { // 登录失败 ndloginfailedrespon(); } if ($remember) { rememberlogin($urname); } $_ssion['urname'] = $urname; header("location:index.php"); break; ca 'logout': ssion_unt(); tcookie("urname", "", time() - 1); header("location:login.php"); break; } function getur() { return array( "urname" => "cyy", "password" => "123456" ); } function ndloginfailedrespon() { $respon = "<script> alert('用户名或密码错误!'); window.location='login.php'; </script>"; echo $respon; die; } function rememberlogin($urname) { tcookie("urname", $urname, time() + 7 * 24 * 3600); }首页index.php
<?php ssion_start(); if (rememberedlogin()) { $_ssion['urname'] = $_cookie['urname']; } if (!hasloggedin()) { header("location:login.php"); die; } function hasloggedin() { return ist($_ssion['urname']) && validateurname($_ssion['urname']); } function validateurname($urname) { return $urname == "cyy"; } function rememberedlogin() { return ist($_cookie['urname']) && validateurname($_cookie['urname']); } ?> <!doctype html> <html> <head> <title>主页</title> <link rel="stylesheet" href="/d/file/titlepic/bootstrap.min.css" integrity="sha384-mcw98/sfnge8fjt3gxweongsv7zt27nxfoaoapmym81iuxopkfojwj8erdknlpmo" crossorigin="anonymous"> </head> <body> <div class="container"> <nav class="navbar navbar-light bg-light"> <a class="navbar-brand"> 使用 cookie 和 ssion 实现会话控制 </a> <a href="action.php?action=logout"> <button class="btn btn-outline-danger my-2 my-sm-0" type="button"> 注销 </button> </a> </nav> <div class="d-flex justify-content-around mt-5"> <div class="card col-5"> <div class="card-body"> <h5 class="card-title"> 会话控制实战内容一 </h5> <h6 class="card-subtitle mb-2 text-muted"> 成人高考英语作文万能句子 ssion 部分 </h6> <p class="card-text"> 实现用户认证功能,用户登录、退出与身份识别 </p> </div> </div> <div class="card col-5"> <div class="card-body"> <h5 class="card-title"> 会话控制实战内容二 </h5> <h6 class="card-subtitle mb-2 text-muted"> cookie 部分 </h6> <p class="card-text"> 实现登录记住用户功能,七天免登录认证 </p> </div> </div> </div> <div class="d-flex justify-content-around mt-4"> <div class="card col-5"> <div class="card-body"> <h5 class="card-title"> 会话控制实战内容一 </h5> <h6 class="card-subtitle mb-2 text-muted"> ssion 部分 </h6> <p class="card-text"> 实现用户认证功能,用户登录、退出与身份识别 </p> </div> </div> <div class="cdnf搬砖哪里最好ard col-5"> <div class="card-body"> <h5 class="card-title"> 会话控制实战内容二 </h5> <h6 class="card-subtitle mb-2 text-muted"> cookie 部分 </h6> <p class="card-text"> 实现登录记住用户功能,七天免登录认证 </p> </div> </div> </div> </div> </body> </html>接下来是会话控制实例:许愿墙源码
许愿墙首页index.php
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="/d/file/titlepic/" xml:lang="en"> <head> <meta http-equiv="content-type" content="text/html;chart=utf-8"> <title>许愿墙</title> <link rel="stylesheet" href="css/index.css" /> <script type="text/javascript" src='js/jquery-1.7.2.min.js'></script> <script type="text/javascript" src='js/index.js'></script> </head> <body> <div id='top'> <a href="wish.php"><span id='nd'></span></a> </div> <div id='main'> <?php //连接数据库 $connection=mysqli_connect('127.0.0.1','root','123456'); if(mysqli_connect_error()){ die(mysqli_connect_error()); } mysqli_lect_db($connection,'wall'); mysqli_t_chart($connection,'utf8'); $sql="lect * from wall"; $result=mysqli_query($connection,$sql); //显示留言 while($row=mysqli_fetch_assoc($result)){ $wish_time=$row['wish_time']; $time=date('y-m-d h:i:s',$wish_time); $id=$row['id']; //判断留言板颜色 switch($row['color']){ ca 'a1': echo "<dl class='paper a1'>"; break; ca 'a2': echo "<dl class='paper a2'>"; break; ca 'a3': echo "<dl class='paper a3'>"; break; ca 'a4': echo "<dl class='paper a4'>"; break; ca 'a5': echo "<dl class='paper a5'>"; break; default: echo "<dl class='paper a1'>"; break; } echo "<dt>"; echo "<span class='urname'>{$row['name']}</span>"; echo "<span class='num'>no.{$row['id']}</span>"; echo "</dt>"; echo "<dd class='content'>{$row['content']}</dd>"; echo "<dd class='bottom'>"; echo "<span class='time'>{$time}</span>"; echo "<a href=\"delete.php?num={$id}\" class='clo'></a>"; echo "</dd>"; echo "</dl>"; } mysqli_clo($connection); ?> </div> <!--[if ie 6]> <script type="text/javascript" src="./js/iepng.js"></script> <script type="text/javascript"> dd_belatedpng.fix('#nd,#clo,.clo','background'); </script> <![endif]--> </body> </html>添加愿望页面wish.php
<!doctype ><html xmlns="/d/file/titlepic/" xml:lang="en"><head><meta http-equiv="content-type" content="text/html;chart=utf-8"><title>许愿墙</title><link rel="stylesheet" href="css/index.css" /><script type="text/javascript" src='js/jquery-1.7.2.min.js'></script><script type="text/javascript" src='js/index.js'></script><style type="text/css">#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: "微软雅黑";}</style></head><body><div id='top'></div><div id="content"><div class="c-top"></div><form action="add.php" method="post" id="myfrom"><div class="c-content"><div class="papercolor"><div class="p-left"><span>请选择纸条颜色:</span></div><div class="p-right"><div class="color330" id="a1" style="background:#ffdfff"></div><div class="color330" id="a2" style="background:#c3fec0"></div><div class="color330" id="a3" style="background:#ffe3b8"></div><div class="color330" id="a4" style="background:#ceecff"></div><div class="color330" id="a5" style="background:#e8deff"></div><input type="hidden" value="" name="idvalue" id="idvalue"> </div></div><div class="papercontent"><div class="left"><div class="left-top"><span>输入你的祝福纸条内容:</span></div><div class="left-bottom"><textarea cols="25" rows="8" id="textfont" name="textfont"></textarea></div></div><div class="right"><div class="right-top"><span>纸条效果预览:</span></div><div class="right-bottom"><div style="height:15px"><span>第x条</span><br/></div><div style="height:100px;margin-top:10px"><span id="font"></span></div><div class="shuname"><span id="name">署名:</span></div> </div></div></div><div class="name"><div class="name-left"><span>您的署名:</span></div><div class="name-right"><input id="nameright" type="text" name="name" value=""></div></div><div class="code"><div class="code-left"><span>验证码:</span></div><div class="code-content"><input id="codeone" type="text" name="recode" value=""><span></span></div><div class="code-right"><input id="codetwo" type="text" name="code" value="<?php echo mt_rand(1000,9999); ?>" readonly></div> </div><!--<div class="submit"><button type="submit" style="width:174px;height:38px"></button></div>--><input style="border-right: #f33b78 1px outt; border-top: #f33b78 1px outt; font-weight: bold; border-left: #f33b78 1px outt; color: #ffffff; border-bottom: #f33b78 1px outt; background-color: #70ae0b;margin-left: 225px" type="submit" value="→ 开始贴许愿小纸条 ←" name="submit" id="submit"><a href="index.php"><input class="input" type="button" name="submit2" value="返回"></a> </div></form><hr/ style="color:orange;width:550"><div class="c-bottom"></div></div><!--[if ie 6]><script type="text/javascript" src="./js/iepng.js"></script><script type="text/javascript">dd_belatedpng.fix('#nd,#clo,.clo','background');</script><![endif]--><script type="text/javascript">//改变颜色$(".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"; } );</script></body></html>新增愿望实现add.php
<?php// 获取表单提交数据$name=$_post['name'];$textfont=$_post['textfont'];$wish_time=time();$color=$_post['idvalue'];// 数据库操作$connection=mysqli_connect('127.0.0.1','root','123456');if(mysqli_connect_error()){die(mysqli_connect_error());}mysqli_lect_db($connection,'wall');mysqli_t_chart($connection,'utf8');$sql="inrt into wall(content,name,wish_time,color) values('$textfont','$name',$wish_time,'$color')";$result=mysqli_query($connection,$sql);if($result){echo '<script>alert("发布成功!");document.location = "index.php";</script>';}el{echo '<script>alert("发布失败!");document.location = "index.php";</script>';}mysqli_clo($connection);?>删除愿望delete.php
<?php//接受要删除的留言id$num=$_get['num'];// 数据库操作$connection=mysqli_connect('127.0.0.1','root','123456');if(mysqli_connect_error()){die(mysqli_connect_error());}mysqli_lect_db($connection,'wall');mysqli_t_chart($connection,'utf8');$sql="delete from wall where id=$num";$result=mysqli_query($connection,$sql);if($result){echo '<script>alert("删除成功!");document.location = "index.php";</script>';}el{echo '<script>alert("删除失败!");document.location = "index.php";</script>';}mysqli_clo($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.4t sql_mode = "no_auto_value_on_zero";t autocommit = 0;start transaction;t time_zone = "+00:00";/*!40101 t @old_character_t_client=@@character_t_client */;/*!40101 t @old_character_t_results=@@character_t_results */;/*!40101 t @old_collation_connection=@@collation_connection */;/*!40101 t names utf8mb4 */;---- 数据库: `wall`---- ----------红色教育内容-------------------------------------------------- 表的结构 `wall`--create table `wall` (`id` tinyint(4) not null comment '留言编号',`content` varchar(200) character t 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 t utf8 collate utf8_general_ci not null comment '留言背景色') engine=innodb default chart=utf8;---- 转存表中的数据 `wall`--inrt 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 t character_t_client=@old_character_t_client */;/*!40101 t character_t_results=@old_character_t_results */;/*!40101 t collation_connection=@old_collation_connection */;
知识点补充:
【使用 cookie 实现会话控制】
用于存储用户关键信息
保存在客户端(浏览器)
通过 http 请求/响应头传输
【cookie 失效】
cookie过期
用户手动删除 cookie
服务器清除 cookie 的有效性
【使用 ssion 实现会话控制】
用于存储用户相关信息
保存在服务端
通过保存在客户端的 ssion id 来定位 ssion 内容
【ssion 失效/清除】
cookie过期(关闭浏览器)
用户手动删除 cookie
服务端删除 ssion 文件或清空 ssion 内容
本文发布于:2023-04-08 02:51:50,感谢您对本站的认可!
本文链接:https://www.wtabcd.cn/fanwen/zuowen/30a2f2504f7b031cc79074bdbacc9123.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文word下载地址:利用会话控制实现页面登录与注销功能(高颜值许愿墙实例源码).doc
本文 PDF 下载地址:利用会话控制实现页面登录与注销功能(高颜值许愿墙实例源码).pdf
| 留言与评论(共有 0 条评论) |