XAMPP的安装和使用

1. 安装和配置

下载地址：https://www.apachefriends.org/zh_cn/download.html
这里以 windows 为例

下载所需版本

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

2. 配置 Apache（看个人电脑不同可选择修不修改）

如果需要修改默认端口（因为如果有些可能会与默认端口产生冲突，如不需要可跳过此步），
点击 config，选择 httpd.conf

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

启动 Apache

在这里插入图片描述

在这里插入图片描述

HTML+PHP实现登录注册功能

我们将项目文件放在安装目录的htdocs文件夹下，如 \xampp\htdocs

在这里插入图片描述

1. php 代码如下

login.php

<?php
$link = mysqli_connect('主机：端口号', '用户名', '密码') 
        or die ('连接失败 : ' . mysqli_error());

mysqli_select_db($link,'tennisword');
mysqli_set_charset($link,'utf8');

$username=$_POST['username'];
$password=$_POST['password'];
 
$sql="select * from reg_info where username='$username' AND password='$password'";

$result=mysqli_query($link,$sql);
if($result->num_rows!=0){
    echo '登录成功！';
}else{
    echo '账号或密码错误！';
}
mysqli_close($link);
?>

reg.php

<?php
    
if(trim($_POST['password'])!=trim($_POST['rpwd']))
{
    exit('两次密码不一致,请返回上一页');
}

$link = mysqli_connect('主机：端口号', '用户名', '密码') 
        or die ('连接失败 : ' . mysqli_error());
mysqli_select_db($link,'tennisword');
mysqli_set_charset($link,'utf8');

$username=$_POST['username'];
$password=$_POST['password'];
 
$sql="insert into reg_info values('$username','$password')";

$result=mysqli_query($link,$sql);
if($result){
    echo'注册成功！';
}else{
    echo'注册失败！';
}

mysqli_close($link);
?>

在 html 的 form 标签里加上 action="xxx.php" method="post"，name 属性要和 php 里的变量相对应。

<form class="mui-input-group" action="login.php" method="post">
            <div class="mui-input-row">
                <label class="account_pass">账号</label>
                <input type="text" name="username" class="mui-input-clear" placeholder="手机号、用户名、邮箱">
            </div>
            
            <div class="mui-input-row">
                <label class="account_pass">密码</label>
                <input type="password" name="password" class="mui-input-clear" placeholder="请输入登录密码">
            </div>
            
            <p align="center">
            <button type="submit" class="mui-btn">登录</button>
            <button type="submit" class="mui-btn">注册</button>
            </P>
            <p align="right">
                <a href="#" style="color: gray; padding-right: 10px;">忘记密码</a>
            </p>
        </form>

2. 测试连接

在浏览器地址栏输入 http://localhost/tennisworld-test/reg.html，成功打开网页。

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述