HTML+PHP+Mysql登录注册页面

最新推荐文章于 2024-07-30 17:27:42 发布

愉快的马儿

最新推荐文章于 2024-07-30 17:27:42 发布

阅读量688

点赞数

分类专栏：面试学习路线阿里巴巴文章标签： php mysql html 前端开发语言

本文链接：https://blog.csdn.net/m0_67266787/article/details/125176781

版权

本文详述了如何使用PHP开发登录和注册页面，包括数据库搭建、验证码生成、HTML和PHP页面的创建。在数据库部分，创建了包含username和password字段的login表，并插入测试数据。验证码部分介绍了一个基本的生成流程，包括设置背景色、字体颜色、随机验证码等。登录和注册页面使用POST方式获取数据，进行数据库连接和用户验证。注册时还需检查用户名是否已存在。项目代码可在本地phpstudy环境中运行。

摘要由CSDN通过智能技术生成

一、PHP开发登录页面

1.数据库搭建

先在mysql数据库中创建一个test数据库login表：

设置如下几个字段：

id : 它是唯一的，类型为 int ，并选择主键。

uesrname : 用户名，类型为 varchar，长度为30。

password : 密码，类型为 varchar，长度为30。

添加一个用于测试的用户名和密码

插入了一个数据username为22222; password为22222

在这里插入图片描述

2.验证码

发表一个产生png图片验证码的基本图像：

1、产生一张png的图片
2、为图片设置背景色
3、设置字体颜色和样式
4、产生4位数的随机的验证码
5、把产生的每个字符调整旋转角度和位置画到png图片上
6、加入噪点和干扰线防止注册机器分析原图片来恶意注册
7、输出图片
8、释放图片所占内存

下面是一个验证码代码实例：

```python

```php
<?php
//设置session,必须处于脚本最顶部
  session_start();
  
  $image = imagecreatetruecolor(100, 30);    //1>设置验证码图片大小的函数
  //5>设置验证码颜色 imagecolorallocate(int im, int red, int green, int blue);
  $bgcolor = imagecolorallocate($image,255,255,255); //#ffffff
  //6>区域填充 int imagefill(int im, int x, int y, int col) (x,y) 所在的区域着色,col 表示欲涂上的颜色
  imagefill($image, 0, 0, $bgcolor);
  //10>设置变量
  $captcha_code = "";
  //7>生成随机数字
  for($i=0;$i<4;$i++){
    //设置字体大小
    $fontsize = 6;
    //设置字体颜色，随机颜色
    $fontcolor = imagecolorallocate($image, rand(0,120),rand(0,120), rand(0,120));      //0-120深颜色
    //设置数字
    $fontcontent = rand(0,9);
    //10>.=连续定义变量
    $captcha_code .= $fontcontent;
    //设置坐标
    $x = ($i*100/4)+rand(5,10);
    $y = rand(5,10);
   imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
  }
  //10>存到session
  $_SESSION['authcode'] = $captcha_code;
  //8>增加干扰元素，设置雪花点
  for($i=0;$i<200;$i++){
    //设置点的颜色，50-200颜色比数字浅，不干扰阅读
    $pointcolor = imagecolorallocate($image,rand(50,200), rand(50,200), rand(50,200));
    //imagesetpixel — 画一个单一像素
    imagesetpixel($image, rand(1,99), rand(1,29), $pointcolor);
  }
  //9>增加干扰元素，设置横线
  for($i=0;$i<4;$i++){
    //设置线的颜色
    $linecolor = imagecolorallocate($image,rand(80,220), rand(80,220),rand(80,220));
    //设置线，两点一线
    imageline($image,rand(1,99), rand(1,29),rand(1,99), rand(1,29),$linecolor);
  }
  //2>设置头部，image/png
  header('Content-Type: image/png');
  //3>imagepng() 建立png图形函数
  imagepng($image);
  //4>imagedestroy() 结束图形函数 销毁$image
  imagedestroy($image);
?>

2.HTML页面

<!DOCTYPE html>
<html>
<head>
    <title>用户登录页面</title>
    <meta charset="UTF-8"/>
    <style type="text/css">
        *{margin:0px;padding:0px;}
        ul{
            width:400px;
            ```php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登陆界面</title>

    <script type="text/javascript">
        function foo(){
            if(myform.name.value=="")
            {
                alert("请输入用户名");
                myform.name.focus();
                return false;
            }
            if (myform.pwd.value=="")
            {
                alert("请输入密码");
                myform.pwd.focus();
                return false;
            }
            if (myform.yzm.value=="")
            {
                alert("请输入验证码");
                myform.yzm.focus();
                return false;
            }
        }
    </script>

    <style type="text/css">
        body{background-image: url("2.png")}
        .container{
            width: 380px;
            height: 330px;
            margin: 0 auto;margin-top: 240px;
            box-shadow: 0 0 20px #222;
            border-radius:40px;
            background-color: rgba(152, 242, 242, 0.23);
        }

        div.right{