因为这个项目已经开始了一点点了,所以就直接贴上代码,不过首先还是放上需求,以后都是需求,实现代码讲解的模式。
需求
1.一套登录系统
分析
1.登录系统首先要有一个登录界面,以login.php命名,上面最起码有一个账号密码的输入与验证,然后有一个登录按钮,有一个重置按钮,有一个注册按钮。
2.登录系统还需要有一个注册界面,以reg.php命名,上面最起码有一个账号名,密码,重复密码的输入框。有确定和重置按钮。前端有基本验证,后台有重名验证。
3.登录以后应该还有一个主界面,以main.php命名,暂时不做功能。
实现
1.建设目录结构 index.php; login.php; reg.php; main.php;
2.index.php代码
<?php
require('login.php');
?>
3.login.php代码
<script type = "text/javascript">
function clearText(){
document.getElementById('username').value = "";
document.getElementById('pwd').value = "";
}
function goToReg(){
window.location.href = "reg.php";
}
function isNull(){
if(document.getElementById('username').value == "" || document.getElementById('pwd').value == ""){
alert('用户名密码不能为空!!');
return false;
}else{
return true;
}
}
</script>
<form method = "post" action = "main.php" onsubmit = "return isNull()" >
<table>
<tr>
<td>用户名:</td>
<td><input type = "text" name = "username" id = "username"></td>
</tr>
<tr>
<td>密码:</td>
<td><input type = "password" name = "pwd" id = "pwd"></td>
</tr>
<tr>
<td><input type = "submit" value = "登录"></td>
<td><input type = "button" value = "清空" onClick = "clearText()" /></td>
<td><input type = "button" value = "注册" onClick = "goToReg()"></td>
</tr>
</table>
</form>
这个文件里面主要是写了一些简单的html,外加写了一些简单的javascript,把他们写在一起的原因是准备一步一步来优化,并没有一步到位把他们的js文件,css文件等等隔离开。
4.reg.php
<meta charset = "gbk">
<script language = "javascript">
function allClear(){
document.getElementById("username").value = "";
document.getElementById("pwd").value = "";
document.getElementById("repwd").value = "";
}
function samePwd(){
var button1 = document.getElementById('pwd');
var button2 = document.getElementById('repwd');
var username = document.getELementById('username');
if(username.value == ""){
alert('请输入用户名!');
return false;
}
alert(username.value);
if(button1.value == ""){
alert('密码不能为空!');
return false;
}
if(button2.value == ""){
alert('重复的密码不能为空!');
return false;
}
if(button1.value == button2.value){
return true;
}else{
alert("请输入相同的密码!!");
return false;
}
return true;
}
</script>
<form method = "post" action = "reg.php" onsubmit = "return samePwd();">
<table>
<tr>
<td>用户名:</td><td><input type = "text" id = "username" name = "username" id = "username" /></td>
</tr>
<tr>
<td>密码:</td><td><input type = "password" id = "pwd" name = "pwd"></td>
</tr>
<tr>
<td>重复密码:</td><td><input type = "password" id = "repwd" name = "repwd"></td>
</tr>
<tr>
<td><input type = "submit" value = "提交"></td><td><input type = "submit" onClick = "allClear()" value = "重填"></td>
</tr>
</table>
</form>
<?php
if(isset($_POST['pwd'])){
if($_POST['pwd'] == $_POST['repwd']){
$con = mysqli_connect('localhost','root','123456','learn');
if(!$con){
die('无法连接数据库');
}
$user = $con->query("select * from user where username = '".$_POST['username']."'")->fetch_array();
if(!empty($user['id'])){
exit('相同的用户名!!');
}
// var_dump($con);
$sql = "insert into `user`(`username`,`pwd`,`create_time`) values('".$_POST['username']."','".md5($_POST['pwd'])."','".time()."')";
//echo $sql,'<br/>';
if($con->query($sql)){
echo '注册成功!!';
} else {
echo '注册失败!!';
}
$con->close();
}else {
echo '两次密码不一致!!';
}
}
?>
因为文件是gbk字符的,所以也就懒得改了,直接设置了字符为gbk,以防乱码,注册就是判断不要为空,然后在数据库里面看看有没有重复的命名,在密码的处理上只是简单的进行了md5加密
5.添加main.php代码来接收和显示登录数据
<?php
if(isset($_POST['username'])){
$con = mysqli_connect('localhost','root','123456','learn');
if(!$con){
die('无法连接到数据库');
}
$sql = "select * from user where username = '".$_POST['username']."'";
$result = $con->query($sql);
if($result){
$user = $result -> fetch_array(MYSQLI_ASSOC);
if(empty($user)){
echo '没有这个用户!!';
exit();
}else{
if(md5($_POST['pwd']) == $user['pwd']){
echo $_POST['username'],'欢迎你!!!!';
}else{
echo '密码错误!!';
exit();
}
}
}else{
echo '查询失败!!';
exit();
}
}
?>
这个页面主要是用来接收登录的信息,来看看是否能够登录。
总结
代码基本上都是用记事本手写出来的,虽然可以用IDE,但是感觉面试的时候总是问具体的函数,经常用IDE和复制粘贴的我真是不太好回答,所以就决定用这个机会全程手写代码,虽然有时候还是挺麻烦的,不过能记住一些函数的名称也值了。在写这些代码的过程中,也顺带复习了HTML,和javascript,因为一直用框架写API,html和JS都忘记的差不多了,抓紧捡一捡。
所有的代码都已经上传到https://github.com/sd142400/learn,欢迎提不同的修改意见,然后我来实现,毕竟一个人的力量真是有限的~!!!
补充
忘记把数据库的表结构发出来了,虽然我的电脑上有安装phpmyadmin,但是还是用命令行把建表命令什么一点一点敲上去的。不过那都是之前的事情了,现在用phpmyadmin把数据表导出如下:
--
-- 数据库: `learn`
--
-- --------------------------------------------------------
--
-- 表的结构 `user`
--
CREATE TABLE IF NOT EXISTS `user` (
`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '自增id',
`username` varchar(128) NOT NULL COMMENT '用户名',
`pwd` varchar(1024) NOT NULL COMMENT '密码',
`create_time` varchar(16) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=gbk AUTO_INCREMENT=5 ;
END