编程马·菜鸟教程

Appearance

第 14 章：基础实战项目 ​

实战 1：简单留言本（表单 + 数据库 + 展示） ​

项目概述 ​

简单留言本是一个基础的 Web 应用，用户可以在页面上提交留言，所有留言会显示在页面上。

技术栈 ​

  • PHP
  • MySQL
  • HTML/CSS

实现步骤 ​

1. 创建数据库和表 ​

sql
CREATE DATABASE IF NOT EXISTS留言本 CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

USE 留言本;

CREATE TABLE IF NOT EXISTS messages (
    id INT PRIMARY KEY AUTO_INCREMENT,
    name VARCHAR(50) NOT NULL,
    content TEXT NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

2. 创建留言本页面 ​

php
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>简单留言本</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            max-width: 800px;
            margin: 0 auto;
        }
        h1 {
            text-align: center;
            color: #333;
        }
        .message-form {
            background-color: #f9f9f9;
            padding: 20px;
            border-radius: 5px;
            margin-bottom: 30px;
        }
        input, textarea {
            width: 100%;
            padding: 10px;
            margin: 10px 0;
            box-sizing: border-box;
        }
        button {
            background-color: #4CAF50;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }
        button:hover {
            background-color: #45a049;
        }
        .message-list {
            margin-top: 30px;
        }
        .message {
            background-color: #f0f0f0;
            padding: 15px;
            margin-bottom: 10px;
            border-radius: 5px;
        }
        .message-header {
            font-weight: bold;
            margin-bottom: 5px;
        }
        .message-time {
            font-size: 12px;
            color: #666;
            margin-top: 5px;
        }
    </style>
</head>
<body>
    <h1>简单留言本</h1>
    
    <!-- 留言表单 -->
    <div class="message-form">
        <h2>发表留言</h2>
        <form method="post" action="">
            <input type="text" name="name" placeholder="请输入您的姓名" required><br>
            <textarea name="content" rows="4" placeholder="请输入留言内容" required></textarea><br>
            <button type="submit" name="submit">提交留言</button>
        </form>
    </div>
    
    <!-- 留言列表 -->
    <div class="message-list">
        <h2>留言列表</h2>
        <?php
        // 连接数据库
        $servername = "localhost";
        $username = "root";
        $password = "";
        $dbname = "留言本";
        
        $conn = mysqli_connect($servername, $username, $password, $dbname);
        
        if (!$conn) {
            die("连接失败: " . mysqli_connect_error());
        }
        
        // 创建数据库和表（如果不存在）
        $sql = "CREATE DATABASE IF NOT EXISTS `留言本` CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci";
        mysqli_query($conn, $sql);
        
        mysqli_select_db($conn, $dbname);
        
        $sql = "CREATE TABLE IF NOT EXISTS messages (
            id INT PRIMARY KEY AUTO_INCREMENT,
            name VARCHAR(50) NOT NULL,
            content TEXT NOT NULL,
            created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
        )";
        mysqli_query($conn, $sql);
        
        // 处理留言提交
        if (isset($_POST['submit'])) {
            $name = mysqli_real_escape_string($conn, $_POST['name']);
            $content = mysqli_real_escape_string($conn, $_POST['content']);
            
            $sql = "INSERT INTO messages (name, content) VALUES ('$name', '$content')";
            if (mysqli_query($conn, $sql)) {
                // 刷新页面
                header("Location: " . $_SERVER['PHP_SELF']);
                exit;
            } else {
                echo "错误: " . mysqli_error($conn);
            }
        }
        
        // 查询留言
        $sql = "SELECT * FROM messages ORDER BY created_at DESC";
        $result = mysqli_query($conn, $sql);
        
        if (mysqli_num_rows($result) > 0) {
            while ($row = mysqli_fetch_assoc($result)) {
                echo "<div class='message'>";
                echo "<div class='message-header'>" . htmlspecialchars($row['name']) . "</div>";
                echo "<div class='message-content'>" . htmlspecialchars($row['content']) . "</div>";
                echo "<div class='message-time'>" . $row['created_at'] . "</div>";
                echo "</div>";
            }
        } else {
            echo "暂无留言";
        }
        
        // 关闭连接
        mysqli_close($conn);
        ?>
    </div>
</body>
</html>

访问页面 ​

  1. 将文件保存为 guestbook.php
  2. 打开浏览器，访问 http://localhost/guestbook.php
  3. 测试留言功能

实战 2：用户注册登录系统 ​

项目概述 ​

用户注册登录系统允许用户注册新账户，然后使用账户登录。

技术栈 ​

  • PHP
  • MySQL
  • HTML/CSS
  • Session

实现步骤 ​

1. 创建数据库和表 ​

sql
CREATE DATABASE IF NOT EXISTS user_system CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

USE user_system;

CREATE TABLE IF NOT EXISTS users (
    id INT PRIMARY KEY AUTO_INCREMENT,
    username VARCHAR(50) NOT NULL UNIQUE,
    email VARCHAR(100) NOT NULL UNIQUE,
    password VARCHAR(255) NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

2. 创建注册页面 ​

php
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            max-width: 400px;
            margin: 0 auto;
        }
        h1 {
            text-align: center;
            color: #333;
        }
        .form-container {
            background-color: #f9f9f9;
            padding: 20px;
            border-radius: 5px;
        }
        input {
            width: 100%;
            padding: 10px;
            margin: 10px 0;
            box-sizing: border-box;
        }
        button {
            background-color: #4CAF50;
            color: white;
            padding: 10px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            width: 100%;
        }
        button:hover {
            background-color: #45a049;
        }
        .error {
            color: red;
            font-size: 12px;
        }
        .success {
            color: green;
            font-size: 12px;
        }
    </style>
</head>
<body>
    <h1>用户注册</h1>
    <div class="form-container">
        <?php
        session_start();
        
        // 连接数据库
        $servername = "localhost";
        $username = "root";
        $password = "";
        $dbname = "user_system";
        
        $conn = mysqli_connect($servername, $username, $password, $dbname);
        
        if (!$conn) {
            die("连接失败: " . mysqli_connect_error());
        }
        
        // 创建数据库和表（如果不存在）
        $sql = "CREATE DATABASE IF NOT EXISTS `user_system` CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci";
        mysqli_query($conn, $sql);
        
        mysqli_select_db($conn, $dbname);
        
        $sql = "CREATE TABLE IF NOT EXISTS users (
            id INT PRIMARY KEY AUTO_INCREMENT,
            username VARCHAR(50) NOT NULL UNIQUE,
            email VARCHAR(100) NOT NULL UNIQUE,
            password VARCHAR(255) NOT NULL,
            created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
        )";
        mysqli_query($conn, $sql);
        
        $message = '';
        $message_type = '';
        
        if (isset($_POST['register'])) {
            $username = mysqli_real_escape_string($conn, $_POST['username']);
            $email = mysqli_real_escape_string($conn, $_POST['email']);
            $password = $_POST['password'];
            $confirm_password = $_POST['confirm_password'];
            
            // 验证
            if (empty($username) || empty($email) || empty($password) || empty($confirm_password)) {
                $message = "所有字段都不能为空";
                $message_type = "error";
            } elseif ($password !== $confirm_password) {
                $message = "两次输入的密码不一致";
                $message_type = "error";
            } else {
                // 检查用户名是否已存在
                $sql = "SELECT * FROM users WHERE username = '$username'";
                $result = mysqli_query($conn, $sql);
                if (mysqli_num_rows($result) > 0) {
                    $message = "用户名已存在";
                    $message_type = "error";
                } else {
                    // 检查邮箱是否已存在
                    $sql = "SELECT * FROM users WHERE email = '$email'";
                    $result = mysqli_query($conn, $sql);
                    if (mysqli_num_rows($result) > 0) {
                        $message = "邮箱已被注册";
                        $message_type = "error";
                    } else {
                        // 加密密码
                        $hashed_password = password_hash($password, PASSWORD_DEFAULT);
                        
                        // 插入用户
                        $sql = "INSERT INTO users (username, email, password) VALUES ('$username', '$email', '$hashed_password')";
                        if (mysqli_query($conn, $sql)) {
                            $message = "注册成功，请登录";
                            $message_type = "success";
                            // 跳转到登录页
                            header("Location: login.php");
                            exit;
                        } else {
                            $message = "注册失败，请重试";
                            $message_type = "error";
                        }
                    }
                }
            }
        }
        
        mysqli_close($conn);
        ?>
        
        <?php if (!empty($message)): ?>
            <p class="<?php echo $message_type; ?>"><?php echo $message; ?></p>
        <?php endif; ?>
        
        <form method="post">
            <input type="text" name="username" placeholder="用户名" required><br>
            <input type="email" name="email" placeholder="邮箱" required><br>
            <input type="password" name="password" placeholder="密码" required><br>
            <input type="password" name="confirm_password" placeholder="确认密码" required><br>
            <button type="submit" name="register">注册</button>
        </form>
        
        <p style="text-align: center; margin-top: 10px;">已有账户？<a href="login.php">登录</a></p>
    </div>
</body>
</html>

3. 创建登录页面 ​

php
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            max-width: 400px;
            margin: 0 auto;
        }
        h1 {
            text-align: center;
            color: #333;
        }
        .form-container {
            background-color: #f9f9f9;
            padding: 20px;
            border-radius: 5px;
        }
        input {
            width: 100%;
            padding: 10px;
            margin: 10px 0;
            box-sizing: border-box;
        }
        button {
            background-color: #4CAF50;
            color: white;
            padding: 10px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            width: 100%;
        }
        button:hover {
            background-color: #45a049;
        }
        .error {
            color: red;
            font-size: 12px;
        }
    </style>
</head>
<body>
    <h1>用户登录</h1>
    <div class="form-container">
        <?php
        session_start();
        
        // 检查是否已登录
        if (isset($_SESSION['user_id'])) {
            header('Location: dashboard.php');
            exit;
        }
        
        // 连接数据库
        $servername = "localhost";
        $username = "root";
        $password = "";
        $dbname = "user_system";
        
        $conn = mysqli_connect($servername, $username, $password, $dbname);
        
        if (!$conn) {
            die("连接失败: " . mysqli_connect_error());
        }
        
        $error = '';
        
        if (isset($_POST['login'])) {
            $username = mysqli_real_escape_string($conn, $_POST['username']);
            $password = $_POST['password'];
            
            // 验证
            if (empty($username) || empty($password)) {
                $error = "用户名和密码不能为空";
            } else {
                // 查找用户
                $sql = "SELECT * FROM users WHERE username = '$username'";
                $result = mysqli_query($conn, $sql);
                if (mysqli_num_rows($result) > 0) {
                    $user = mysqli_fetch_assoc($result);
                    // 验证密码
                    if (password_verify($password, $user['password'])) {
                        // 登录成功，设置 session
                        $_SESSION['user_id'] = $user['id'];
                        $_SESSION['username'] = $user['username'];
                        $_SESSION['email'] = $user['email'];
                        // 跳转到 dashboard
                        header('Location: dashboard.php');
                        exit;
                    } else {
                        $error = "密码错误";
                    }
                } else {
                    $error = "用户名不存在";
                }
            }
        }
        
        mysqli_close($conn);
        ?>
        
        <?php if (!empty($error)): ?>
            <p class="error"><?php echo $error; ?></p>
        <?php endif; ?>
        
        <form method="post">
            <input type="text" name="username" placeholder="用户名" required><br>
            <input type="password" name="password" placeholder="密码" required><br>
            <button type="submit" name="login">登录</button>
        </form>
        
        <p style="text-align: center; margin-top: 10px;">没有账户？<a href="register.php">注册</a></p>
    </div>
</body>
</html>

4. 创建 dashboard 页面 ​

php
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>用户中心</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        .welcome {
            float: right;
        }
        h1 {
            color: #333;
        }
    </style>
</head>
<body>
    <?php
    session_start();
    
    // 检查是否登录
    if (!isset($_SESSION['user_id'])) {
        header('Location: login.php');
        exit;
    }
    
    if (isset($_GET['logout'])) {
        // 注销登录
        session_destroy();
        header('Location: login.php');
        exit;
    }
    ?>
    
    <div class="welcome">
        欢迎，<?php echo $_SESSION['username']; ?>！
        <a href="?logout">注销</a>
    </div>
    
    <h1>用户中心</h1>
    <p>这是用户中心页面，只有登录用户才能访问。</p>
    <p>用户 ID：<?php echo $_SESSION['user_id']; ?></p>
    <p>用户名：<?php echo $_SESSION['username']; ?></p>
    <p>邮箱：<?php echo $_SESSION['email']; ?></p>
</body>
</html>

访问页面 ​

  1. 将文件保存为 register.php、login.php 和 dashboard.php
  2. 打开浏览器，访问 http://localhost/register.php
  3. 注册新用户，然后登录测试

实战 3：商品列表展示页面 ​

项目概述 ​

商品列表展示页面用于展示商品信息，包括商品名称、价格、描述等。

技术栈 ​

  • PHP
  • MySQL
  • HTML/CSS

实现步骤 ​

1. 创建数据库和表 ​

sql
CREATE DATABASE IF NOT EXISTS shop CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

USE shop;

CREATE TABLE IF NOT EXISTS products (
    id INT PRIMARY KEY AUTO_INCREMENT,
    name VARCHAR(100) NOT NULL,
    price DECIMAL(10,2) NOT NULL,
    description TEXT,
    image VARCHAR(255),
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

-- 插入示例数据
INSERT INTO products (name, price, description, image) VALUES
('iPhone 14', 5999.00, '苹果最新款手机', 'https://via.placeholder.com/200'),
('MacBook Pro', 12999.00, '苹果笔记本电脑', 'https://via.placeholder.com/200'),
('AirPods Pro', 1999.00, '苹果无线耳机', 'https://via.placeholder.com/200'),
('iPad Air', 4799.00, '苹果平板电脑', 'https://via.placeholder.com/200'),
('Apple Watch', 2999.00, '苹果智能手表', 'https://via.placeholder.com/200');

2. 创建商品列表页面 ​

php
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>商品列表</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        h1 {
            text-align: center;
            color: #333;
        }
        .product-list {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-top: 30px;
        }
        .product {
            width: 200px;
            border: 1px solid #ddd;
            border-radius: 5px;
            padding: 15px;
            background-color: #f9f9f9;
        }
        .product img {
            width: 100%;
            height: 150px;
            object-fit: cover;
            border-radius: 5px;
        }
        .product-name {
            font-weight: bold;
            margin: 10px 0;
        }
        .product-price {
            color: #e74c3c;
            font-weight: bold;
            margin: 10px 0;
        }
        .product-description {
            font-size: 12px;
            color: #666;
        }
    </style>
</head>
<body>
    <h1>商品列表</h1>
    
    <div class="product-list">
        <?php
        // 连接数据库
        $servername = "localhost";
        $username = "root";
        $password = "";
        $dbname = "shop";
        
        $conn = mysqli_connect($servername, $username, $password, $dbname);
        
        if (!$conn) {
            die("连接失败: " . mysqli_connect_error());
        }
        
        // 创建数据库和表（如果不存在）
        $sql = "CREATE DATABASE IF NOT EXISTS `shop` CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci";
        mysqli_query($conn, $sql);
        
        mysqli_select_db($conn, $dbname);
        
        $sql = "CREATE TABLE IF NOT EXISTS products (
            id INT PRIMARY KEY AUTO_INCREMENT,
            name VARCHAR(100) NOT NULL,
            price DECIMAL(10,2) NOT NULL,
            description TEXT,
            image VARCHAR(255),
            created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
        )";
        mysqli_query($conn, $sql);
        
        // 检查是否有数据
        $sql = "SELECT COUNT(*) FROM products";
        $result = mysqli_query($conn, $sql);
        $row = mysqli_fetch_assoc($result);
        
        if ($row['COUNT(*)'] == 0) {
            // 插入示例数据
            $sql = "INSERT INTO products (name, price, description, image) VALUES
            ('iPhone 14', 5999.00, '苹果最新款手机', 'https://via.placeholder.com/200'),
            ('MacBook Pro', 12999.00, '苹果笔记本电脑', 'https://via.placeholder.com/200'),
            ('AirPods Pro', 1999.00, '苹果无线耳机', 'https://via.placeholder.com/200'),
            ('iPad Air', 4799.00, '苹果平板电脑', 'https://via.placeholder.com/200'),
            ('Apple Watch', 2999.00, '苹果智能手表', 'https://via.placeholder.com/200')";
            mysqli_query($conn, $sql);
        }
        
        // 查询商品
        $sql = "SELECT * FROM products";
        $result = mysqli_query($conn, $sql);
        
        if (mysqli_num_rows($result) > 0) {
            while ($row = mysqli_fetch_assoc($result)) {
                echo "<div class='product'>";
                echo "<img src='" . $row['image'] . "' alt='" . $row['name'] . "'>";
                echo "<div class='product-name'>" . $row['name'] . "</div>";
                echo "<div class='product-price'>¥" . $row['price'] . "</div>";
                echo "<div class='product-description'>" . $row['description'] . "</div>";
                echo "</div>";
            }
        } else {
            echo "暂无商品";
        }
        
        // 关闭连接
        mysqli_close($conn);
        ?>
    </div>
</body>
</html>

访问页面 ​

  1. 将文件保存为 products.php
  2. 打开浏览器，访问 http://localhost/products.php
  3. 查看商品列表

小结 ​

通过本章的学习，你完成了三个基础实战项目：简单留言本、用户注册登录系统和商品列表展示页面。这些项目涵盖了 PHP 开发的核心功能，包括表单处理、数据库操作、会话管理等。通过这些项目的实践，你可以巩固之前学习的 PHP 基础知识，并为后续的完整项目开发做好准备。

© 2026 编程马·菜鸟教程 版权所有

基于 VitePress 构建