网站推广.NET

网站推广.NET

php源码之搭建站点实现登录页面的方法

来源:互联网

这篇文章主要介绍了关于php源码之搭建站点实现登录页面的方法,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下

主要:

  1. 站点搭建

  2. 实现登录页面

  3. 分析及改进

    立即学习“PHP免费学习笔记(深入)”;


站点搭建

1)  在apache安装目录下: 【conf\extra\httpd-vhosts.conf】加入站点配置

 1 <VirtualHost *:80>  2     #站点根目录  3     DocumentRoot "D:\htdocs\Demo"  4       #站点绑定的域名  5     ServerName www.test.com  6      #站点别名  7     ServerAlias test.com  8   <Directory  "D:\htdocs\Demo">  9         #允许所有访问 10         #allow from all 11         Require all granted 12         #允许分布式权限配置(允许重写)(.htacess) 13         AllowOverride All 14         #不显示站点目录的文件结构 15         Options -indexes 16   </Directory> 17 </VirtualHost>

2) host文件添加域名解析。 host文件位置:【C:\Windows\System32\drivers\etc\hosts】

1 127.0.0.1 www.test.com  test.com

3) 重启apache。 完成站点配置。

实现登录页面

1)创建项目目录blog 【D:\htdocs\Demo\blog】, 初始化git,并提交到码云

在项目目录中右键》Git Bash 前提:已经安装git

1  git init 2  git remote add origin  3  git pull origin master

2)用户数据表pbg_users

 1 CREATE TABLE `pbg_users` (  2   `id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT &#39;用户主键&#39;,  3   `username` varchar(20) NOT NULL COMMENT &#39;用户名&#39;,  4   `pwd` char(32) NOT NULL COMMENT &#39;密码&#39;,  5   `email` varchar(50) NOT NULL DEFAULT &#39;&#39; COMMENT &#39;注册邮箱&#39;,  6   `token_email` varchar(32) NOT NULL DEFAULT &#39;&#39; COMMENT &#39;邮箱验证&#39;,  7   `flag` tinyint(1) unsigned NOT NULL DEFAULT &#39;0&#39; COMMENT &#39;是否是管理员,1-管理员,2-普通用户&#39;,  8   `created_at` datetime DEFAULT NULL COMMENT &#39;注册时间&#39;,  9   `updated_at` datetime DEFAULT NULL COMMENT &#39;最后一次登录时间&#39;, 10   `login_ip` varchar(20) NOT NULL DEFAULT &#39;&#39; COMMENT &#39;最后登录的ip地址&#39;, 11   `login_times` smallint(6) NOT NULL DEFAULT &#39;0&#39; COMMENT &#39;登录次数&#39;, 12   PRIMARY KEY (`id`), 13   UNIQUE KEY `username` (`username`), 14   UNIQUE KEY `email` (`email`) 15 ) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;

3) 登录界面【login.html】

 1 <!DOCTYPE html>  2 <html lang="zh-CN">  3 <head>  4     <meta charset="UTF-8">  5     <title>登录</title>  6     <link rel="stylesheet" type="text/css" href="layui/css/layui.css">  7     <link rel="stylesheet" type="text/css" href="css/style.css">  8 </head>  9 <body> 10 <p class="container"> 11     <p class="content"> 12         <form action="login.php" class="layui-form" method="post"> 13             <p class="layui-form-item"> 14                 <h2>登录</h2> 15             </p><hr> 16  17             <p class="layui-form-item"> 18                 <label class="layui-form-label">用户名:</label> 19                 <p class="layui-input-block"> 20                     <input type="text" name="username" class="layui-input" required  lay-verify="required"  placeholder="请输入用户名" autocomplete="off" > 21                 </p> 22             </p> 23  24             <p class="layui-form-item"> 25                 <label class="layui-form-label">密   码:</label> 26                 <p class="layui-input-block"> 27                     <input type="password" name="pwd" required lay-verify="required" placeholder="请输入密码"  class="layui-input"> 28                 </p> 29             </p> 30  31             <p class="layui-form-item"> 32                 <p class="layui-input-block"> 33                     <button  lay-submit class="layui-btn">登录</button> 34                     <button type="reset" class="layui-btn layui-btn-primary">重置</button> 35                 </p> 36             </p> 37         </form> 38     </p> 39 </p> 40 <script type="text/javascript" src="layui/layui.js"></script> 41 <script> 42     layui.use(&#39;form&#39;, function(){ 43         var form = layui.form; 44     }); 45 </script> 46 </body> 47 </html>

4) 登录页面样式调整【css/style.css】

 1 @charset "UTF-8";  2   3 body {  4     background-color: #1E9FFF;  5 }  6   7 /*登录*/ 8 .container {  9     position: absolute; 10     left: 50%; 11     top:50%; 12     width: 500px; 13     margin-left: -250px; 14     margin-top: -200px;" 15 } 16 .content{ 17     background: #ffffff; 18     padding: 20px; 19     border-radius: 4px; 20     box-shadow: 5px 5px 50px #444444; 21 }

查看样式表

5)登录操作: 处理登录信息 【login.php】

 1 <?php  2 /**  3  * 登录数据处理  4  * User: young  5  */  6 header("content-type:text/html;charset=utf-8");  7 //1-接收登录信息  8 $data = array();  9 $data[&#39;username&#39;] = trim($_POST[&#39;username&#39;]); 10 $data[&#39;pwd&#39;] = trim($_POST[&#39;pwd&#39;]); 11  12 //2-连接数据库 13 $conn = @mysql_connect(&#39;localhost&#39;,&#39;root&#39;,&#39;root&#39;) or die(&#39;连接数据库失败!&#39;); 14 // mysql_set_charset("utf8"); 15 // mysql_select_db("web"); 16 mysql_query(&#39;set names utf8&#39;,$conn); 17 mysql_query(&#39;use web&#39;,$conn); 18  19 //3-查询数据库  校验登录信息 20 $sql = "select username,pwd from pbg_users where username=&#39;{$data[&#39;username&#39;]}&#39;"; 21 $res = mysql_query($sql,$conn); 22  23 //4-登录结果提示信息 24 if($res != false){ 25     $user = mysql_fetch_array($res); 26     if( $user[&#39;pwd&#39;] == md5($data[&#39;pwd&#39;]) ){ exit(&#39;登录成功&#39;); } 27 } 28 echo "用户名或密码不正确!"; 29 header(&#39;refresh:3; url=login.html&#39;);

点击查看

6)登录界面效果

分析改进

1)准备优化

  1. 文件目录结构,实现MVC结构

  2. 访问形式: 实现单入口文件访问

2)提交代码:

1 git add -A2 git commit -m "第一次提交 && 登录页"3 git push origin master

查看本项目源码: https://gitee.com/NewbiesYang/young_blog

小结:本次主要完成:

1. 站点配置

2. 登录数据表和登录页制作,登录逻辑简单实现

3. 下一步优化改进

相关推荐:

php源码之实现单入口MVC结构的方法

php 批量去除项目文件bom头的方法

php源码