php实现留言板功能
PHP 留言板功能实现
数据库设计
创建数据库表 messages，包含以下字段：
id：自增主键name：留言者姓名（VARCHAR）email：留言者邮箱（VARCHAR）content：留言内容（TEXT）created_at：留言时间（TIMESTAMP）
SQL 建表语句：
CREATE TABLE messages (
id INT AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(100) NOT NULL,
email VARCHAR(100) NOT NULL,
content TEXT NOT NULL,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);连接数据库
创建 config.php 文件存放数据库连接信息：
<?php
$host = 'localhost';
$dbname = 'message_board';
$username = 'root';
$password = '';
try {
$pdo = new PDO("mysql:host=$host;dbname=$dbname", $username, $password);
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch (PDOException $e) {
die("数据库连接失败: " . $e->getMessage());
}
?>提交留言功能
创建 submit.php 处理表单提交：
<?php
require 'config.php';
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$name = htmlspecialchars($_POST['name']);
$email = filter_var($_POST['email'], FILTER_VALIDATE_EMAIL);
$content = htmlspecialchars($_POST['content']);
if ($name && $email && $content) {
$stmt = $pdo->prepare("INSERT INTO messages (name, email, content) VALUES (?, ?, ?)");
$stmt->execute([$name, $email, $content]);
header("Location: index.php");
exit;
}
}
?>显示留言列表
创建 index.php 显示所有留言：
<?php
require 'config.php';
$stmt = $pdo->query("SELECT * FROM messages ORDER BY created_at DESC");
$messages = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<!DOCTYPE html>
<html>
<head>
<title>留言板</title>
</head>
<body>
<h1>留言板</h1>
<form action="submit.php" method="post">
<input type="text" name="name" placeholder="姓名" required>
<input type="email" name="email" placeholder="邮箱" required>
<textarea name="content" placeholder="留言内容" required></textarea>
<button type="submit">提交</button>
</form>
<div class="messages">
<?php foreach ($messages as $message): ?>
<div class="message">
<h3><?= htmlspecialchars($message['name']) ?></h3>
<p><?= htmlspecialchars($message['content']) ?></p>
<small><?= $message['created_at'] ?></small>
</div>
<?php endforeach; ?>
</div>
</body>
</html>安全增强措施
- 对用户输入使用
htmlspecialchars()防止 XSS 攻击 - 使用 PDO 预处理语句防止 SQL 注入
- 对邮箱字段使用
filter_var()验证格式 - 设置 PDO 错误模式为异常模式
数据验证 在客户端和服务器端都进行验证：
// 客户端验证示例
document.querySelector('form').addEventListener('submit', function(e) {
if (!this.name.value || !this.email.value || !this.content.value) {
e.preventDefault();
alert('请填写所有字段');
}
});样式优化 添加基础 CSS 样式：
body {
font-family: Arial, sans-serif;
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
form {
margin-bottom: 30px;
padding: 20px;
background: #f5f5f5;
border-radius: 5px;
}
input, textarea {
display: block;
width: 100%;
margin-bottom: 10px;
padding: 8px;
}
button {
background: #4CAF50;
color: white;
border: none;
padding: 10px 15px;
cursor: pointer;
}
.message {
border-bottom: 1px solid #ddd;
padding: 15px 0;
}
