主要:

  1. 站点搭建
  2. 实现登录页面
  3. 分析及改进

站点搭建

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

 <VirtualHost *:>
#站点根目录
DocumentRoot "D:\htdocs\Demo"
#站点绑定的域名
ServerName www.test.com
#站点别名
ServerAlias test.com
<Directory "D:\htdocs\Demo">
#允许所有访问
#allow from all
Require all granted
#允许分布式权限配置(允许重写)(.htacess)
AllowOverride All
#不显示站点目录的文件结构
Options -indexes
</Directory>
</VirtualHost>

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

 127.0.0.1 www.test.com  test.com

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

实现登录页面

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

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

  git init
git remote add origin https://gitee.com/NewbiesYang/young_blog
git pull origin master

2)用户数据表pbg_users

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

3) 登录界面【login.html】

 <!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>登录</title>
<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div class="container">
<div class="content">
<form action="login.php" class="layui-form" method="post">
<div class="layui-form-item">
<h2>登录</h2>
</div><hr> <div class="layui-form-item">
<label class="layui-form-label">用户名:</label>
<div class="layui-input-block">
<input type="text" name="username" class="layui-input" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" >
</div>
</div> <div class="layui-form-item">
<label class="layui-form-label">密&nbsp;&nbsp;&nbsp;码:</label>
<div class="layui-input-block">
<input type="password" name="pwd" required lay-verify="required" placeholder="请输入密码" class="layui-input">
</div>
</div> <div class="layui-form-item">
<div class="layui-input-block">
<button lay-submit class="layui-btn">登录</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
</div>
</div>
<script type="text/javascript" src="layui/layui.js"></script>
<script>
layui.use('form', function(){
var form = layui.form;
});
</script>
</body>
</html>

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

 @charset "UTF-8";

 body {
background-color: #1E9FFF;
} /*登录*/
.container {
position: absolute;
left: 50%;
top:50%;
width: 500px;
margin-left: -250px;
margin-top: -200px;"
}
.content{
background: #ffffff;
padding: 20px;
border-radius: 4px;
box-shadow: 5px 5px 50px #444444;
}

查看样式表

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

 <?php
/**
* 登录数据处理
* User: young
*/
header("content-type:text/html;charset=utf-8");
//1-接收登录信息
$data = array();
$data['username'] = trim($_POST['username']);
$data['pwd'] = trim($_POST['pwd']); //2-连接数据库
$conn = @mysql_connect('localhost','root','root') or die('连接数据库失败!');
// mysql_set_charset("utf8");
// mysql_select_db("web");
mysql_query('set names utf8',$conn);
mysql_query('use web',$conn); //3-查询数据库 校验登录信息
$sql = "select username,pwd from pbg_users where username='{$data['username']}'";
$res = mysql_query($sql,$conn); //4-登录结果提示信息
if($res != false){
$user = mysql_fetch_array($res);
if( $user['pwd'] == md5($data['pwd']) ){ exit('登录成功'); }
}
echo "用户名或密码不正确!";
header('refresh:3; url=login.html');

点击查看

6)登录界面效果

分析改进

1)准备优化

  1. 文件目录结构,实现MVC结构
  2. 访问形式: 实现单入口文件访问

2)提交代码:

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

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

小结:本次主要完成:

1. 站点配置

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

3. 下一步优化改进

php源码建博客1--搭建站点-实现登录页面的更多相关文章

  1. php源码建博客5--建库建表-配置文件-错误日志

    主要: 整理框架 建库建表 配置文件类 错误日志记录 --------------本篇后文件结构:-------------------------------------- blog ├─App │ ...

  2. php源码建博客4--实现MVC结构微型框架

    主要: 常量优化路径 自动加载类 优化入口文件 安全访问项目目录 --------------文件结构:-------------------------------------- blog├─App ...

  3. php源码建博客3--区分平台的MVC结构

    主要: 模型单例工厂 目录结构优化 区分平台(前台,后台....) --------------文件结构:-------------------------------------- blog├─Ap ...

  4. php源码建博客2--实现单入口MVC结构

    主要: MVC目录结构 数据库工具类制作 创建公共模型类和公共控制器类 --------------文件结构:-------------------------------------- blog├─ ...

  5. spark 源码阅读博客

    http://blog.csdn.net/oopsoom/article/details/38257749

  6. 象写程序一样写博客:搭建基于github的博客

    象写程序一样写博客:搭建基于github的博客   前言 github 真是无所不能.其 Pages 功能 支持上传 html,并且在页面中显示.于是有好事者做了一个基于 github 的博客管理工具 ...

  7. LNMP小项目搭建,Centos7.6环境搭建Linux+nginx+mysql+php,wordpress个人博客的搭建(完整搭建步骤)

    一.LNMP搭建,基于nginx服务器搭建wordpress个人博客 准备环境:centos7.6环境下web服务器(nginx+php):主机名:web01,ip:192.168.248.172my ...

  8. 用hugo建博客的记录 · 老张不服老

    前后累计折腾近6个小时,总算把搭建hugo静态博客的整个过程搞清楚了.为什么用了这么久?主要还是想偷懒,不喜欢读英文说明.那就用中文记录一下过程吧.还是中文顺眼啊. 某日发现自己有展示些东西给外网的需 ...

  9. Github pages + jekyll 博客快速搭建

    Github pages + jekyll 博客快速搭建 寻找喜欢的模版 https://github.com/jekyll/jekyll/wiki/sites http://jekyllthemes ...

随机推荐

  1. Java任务调度框架Quartz入门

    Quartz[kwɔːts]:石英,其框架和名字一样简单朴素又不失魅力,在Java程序界,Quartz大名鼎鼎,很多Java应用几乎都集成或构建了一个定时任务调度系统,Quartz是一个定时任务调度框 ...

  2. Linux ->> VMWare Workstation虚拟机里的UBuntu系统安装VMWare-tools

    1) mkdir创建一个临时目录 2)复制gz压缩包到临时目录下 3)解压到当前目录 4)运行.pl文件安装 root@ubuntu:/# root@ubuntu:/# cd /tmp/ root@u ...

  3. 求n的元素的最大最小值

    public static int[] maxMin(int a[]) { int[] res = new int[2]; int len = a.length; if (len <= 0) { ...

  4. Google play billing(Google play 内支付) 下篇

    开篇: 如billing开发文档所说,要在你的应用中实现In-app Billing只需要完成以下几步就可以了. 第一,把你上篇下载的AIDL文件添加到你的工程里,第二,把 <uses-perm ...

  5. July 21st 2017 Week 29th Friday

    If you want to fly too high in relation to the horizon forget. 要想飞得高,就该把地平线忘掉. Always keep our eyes ...

  6. Future Research Directions in Social Recommendation

    From the tutorial published by Martin Ester in RecSys 2013 Future Research Directions --Recommendati ...

  7. SAP技术专家的ABAP调试器培训材料

    首先弄清楚ABAP Classic调试器和新调试器的区别: Classic debugger: (1) Static breakpoint a. BREAK-POINT : non-user spec ...

  8. 使用SAP C4C rule editor动态控制UI上某个按钮是否显示

    假设我想根据Sales Order的outbound delivery字段来控制这个Trigger Delivery按钮的动态显示: 首先Adapt->Edit Master Layout进入K ...

  9. Java 中的引用

    JVM 是根据可达性分析算法找出需要回收的对象,判断对象的存活状态都和引用有关. 在 JDK1.2 之前这点设计的非常简单:一个对象的状态只有引用和没被引用两种区别. 这样的划分对垃圾回收不是很友好, ...

  10. luogu3368树状数组模板2

    题目链接:https://www.luogu.org/problemnew/show/P3368 题意:与模板1不同的是这题的操作是树状数组并不在行的区间更新和单点查找,如果按照模板1那样写肯定会T. ...