好的，下面是用
PHP、JS 和 HTML 编写的
一个基本的 Web 在线聊天程序，包含账号系统。这个程序由以下几个文件组成：
1. index.
php：这是程序的首页，包含登录和注册页面。当用户访问这个页面时，如果已经登录，则跳转到 chat.
php 页面；如果没有登录，则显示登录和注册表单。
```
php
<?
php
session_start();
if(isset($_SESSION['user_id'])){ // 如果已经登录，则跳转到聊天页面
header("Location: chat.
php");
exit;
}
require 'config.
php'; // 数据库配置文件
$message = '';
// 处理注册表单提交
if(!empty($_POST['register'])){
$username = trim($_POST['username']);
$password = trim($_POST['password']);
// 验证表单输入是否合法
if(empty($username) || empty($password)){
$message = '用户名和密码不能为空！';
} else {
// 检查用户名是否已经被注册
$query = $pdo->prepare("SELECT * FROM users WHERE username = ?");
$query->execute([$username]);
$user = $query->fetch();
if($user){
$message = '用户名已经被注册，请选择其他用户名！';
} else {
// 将用户信息插入到数据库中
$password_hash = password_hash($password, PASSWORD_DEFAULT);
$query = $pdo->prepare("INSERT INTO users (username, password) VALUES (?, ?)");
$query->execute([$username, $password_hash]);
$message = '注册成功！请登录。';
}
}
}
// 处理登录表单提交
if(!empty($_POST['login'])){
$username = trim($_POST['username']);
$password = trim($_POST['password']);
// 验证表单输入是否合法
if(empty($username) || empty($password)){
$message = '用户名和密码不能为空！';
} else {
// 检查用户名和密码是否匹配
$query = $pdo->prepare("SELECT * FROM users WHERE username = ?");
$query->execute([$username]);
$user = $query->fetch();
if($user && password_verify($password, $user['password'])){
// 登录成功，将用户信息存储到 session 中
$_SESSION['user_id'] = $user['id'];
$_SESSION['username'] = $user['username'];
header("Location: chat.
php");
exit;
} else {
$message = '用户名或密码错误！';
}
}
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>在线聊天室 - 登录/注册</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="container">
<h1>在线聊天室</h1>
<h2>登录/注册</h2>
<div class="message"><?
php echo $message; ?></div>
<div class="form-container">
<form method="post">
<h3>登录</h3>
<input type="text" name="username" placeholder="用户名" required>
<input type="password" name="password" placeholder="密码" required>
<button type="submit" name="login">登录</button>
</form>
<form method="post">
<h3>注册</h3>
<input type="text" name="username" placeholder="用户名" required>
<input type="password" name="password" placeholder="密码" required>
<button type="submit" name="register">注册</button>
</form>
</div>
</div>
</body>
</html>
```
2. chat.
php：这是程序的聊天页面。当用户登录后，会跳转到这个页面。这个页面包含
一个聊天窗口和
一个输入框。当用户输入聊天内容时，会通过 Ajax 发送请求到 send.
php 文件，并将聊天内容存储到数据库中。同时，这个页面会每隔一段时间通过 Ajax 请求获取最新的聊天记录，并将其显示在聊天窗口中。
```
php
<?
php
session_start();
if(!isset($_SESSION['user_id'])){ // 如果没有登录，则跳转到登录页面
header("Location: index.
php");
exit;
}
require 'config.
php'; // 数据库配置文件
$user_id = $_SESSION['user_id'];
$username = $_SESSION['username'];
// 处理发送聊天信息的逻辑
if(!empty($_POST['message'])){
$message = trim($_POST['message']);
// 将聊天信息存储到数据库中
$query = $pdo->prepare("INSERT INTO messages (user_id, username, message) VALUES (?, ?, ?)");
$query->execute([$user_id, $username, $message]);
exit;
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>在线聊天室 - <?
php echo $username; ?></title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="jquery.min.js"></script>
<script>
$(function(){
// 发送聊天信息
$('#message-form').on('submit', function(e){
e.preventDefault();
var message = $('#message').val();
if(message){
$.ajax({
url: 'send.
php',
method: 'post',
data: {message: message},
success: function(){
$('#message').val('');
}
});
}
});
// 获取最新的聊天记录
function getMessages(){
$.ajax({
url: 'messages.
php',
success: function(data){
$('#messages').html(data);
}
});
}
setInterval(getMessages, 1000); // 每隔一秒钟获取一次最新的聊天记录
});
</script>
</head>
<body>
<div class="container">
<h1>在线聊天室</h1>
<h2><?
php echo $username; ?></h2>
<div class="chat-container">
<div id="messages"></div>
<form id="message-form">
<input type="text" id="message" placeholder="请输入聊天内容">
<button type="submit">发送</button>
</form>
</div>
<a href="logout.
php" class="logout">退出登录</a>
</div>
</body>
</html>
```
3. send.
php：这个文件负责将用户发送的聊天内容存储到数据库中。当用户发送聊天内容时，会通过 Ajax 发送请求到这个文件。
```
php
<?
php
require 'config.
php'; // 数据库配置文件
session_start();
if(isset($_SESSION['user_id'])){
$user_id = $_SESSION['user_id'];
$username = $_SESSION['username'];
$message = trim($_POST['message']);
// 将聊天信息存储到数据库中
$query = $pdo->prepare("INSERT INTO messages (user_id, username, message) VALUES (?, ?, ?)");
$query->execute([$user_id, $username, $message]);
}
```
4. messages.
php：这个文件负责返回最新的聊天记录。当 chat.
php 页面每隔一段时间通过 Ajax 请求这个文件时，会返回最新的聊天记录并将其显示在聊天窗口中。
```
php
<?
php
require 'config.
php'; // 数据库配置文件
$query = $pdo->prepare("SELECT * FROM messages ORDER BY id DESC LIMIT 10"); // 获取最新的10条聊天记录
$query->execute();
$messages = $query->fetchAll(PDO::FETCH_ASSOC);
foreach($messages as $message){
echo '<div class="message">';
echo '<span class="username">' . $message['username'] . '：</span>';
echo '<span class="text">' . $message['message'] . '</span>';
echo '</div>';
}
```
5. logout.
php：这个文件负责处理用户退出登录的逻辑。当用户点击退出登录按钮时，会将 session 中的用户信息清空，并跳转回 index.
php 页面。
```
php
<?
php
session_start();
session_destroy();
header("Location: index.
php");
exit;
```
6. config.
php：这个文件包含数据库的连接信息。
```
php
<?
php
$host = 'localhost';
$dbname = 'chat';
$username = 'root';
$password = '';
$pdo = new PDO("mysql:host=$host;dbname=$dbname", $username, $password);
```
以上就是这个 Web 在线聊天程序的基本文件和使用方式。需要注意的是，这个程序还有许多细节需要完善，例如输入验证、安全性等方面，需要根据实际情况进行改进。
最低0.47元/天 解锁文章
4792
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
