源码介绍

一个匿名的聊天室程序，UI精美、简约 功能强大交互流畅 搭建以及维护简单

搭建教程

1. 虚拟主机一台，环境要求PHP7.4及以上（宝塔、cPanel、阿里云虚拟主机均可）

2. 配套MySQL数据库，大部分虚拟主机购买后免费赠送

3. 文件传输工具：免费FileZilla，也可直接使用主机在线文件管理器

压缩包内部文件结构

[code]

anon-chat/

├── dist/ # 编译完成前端页面，直接上传使用│

├── index.html│

├── favicon.svg│

└── assets/│

├── index-xxx.js│

└── index-xxx.css

├── php-api/ # PHP后端接口文件夹│

├── config.php # 数据库配置文件（必须修改）│

├── rooms.php # 房间创建/查询接口│

├── messages/index.php # 消息收发接口│

└── database.sql # 数据库建表导入脚本

└── 部署教程.md

[/code]

全套搭建步骤（全程约10分钟）

第一步：导入数据库（2分钟）

1. 登录虚拟主机控制面板

2. 找到phpMyAdmin数据库管理工具并进入

3. 选中你提前创建好的数据库

4. 页面顶部点击【导入】选项卡

5. 点击选择文件，选中压缩包内  php-api/database.sql 

6. 点击执行按钮

7. 页面提示导入成功，数据库自动生成rooms、messages两张数据表

第二步：修改数据库配置（1分钟）

记事本/VSCode打开  php-api/config.php ，修改下方数据库参数

[code]

define(‘DB_HOST’, ‘localhost’); // 数据库地址

define(‘DB_NAME’, ‘your_database’); // 数据库名称

define(‘DB_USER’, ‘your_username’); // 数据库账号

define(‘DB_PASS’, ‘your_password’); // 数据库密码

[/code]

替换成虚拟主机后台提供的数据库信息，修改完成保存文件。

第三步：上传网站文件（5分钟） FTP连接主机，文件全部上传至网站根目录  public_html/

 需要上传内容：

1. dist文件夹内全部文件 → 上传至  public_html/  根目录包含 index.html、favicon.svg、assets文件夹（存放JS、CSS样式）

2. 完整php-api文件夹 → 上传至  public_html/php-api/  上传完成后目录参考：

[code]

public_html/

├── index.html

├── favicon.svg

├── assets/│

├── index-xxx.js│

└── index-xxx.css

└── php-api/

├── config.php

├── rooms.php

└── messages/

└── index.php

[/code]

禁止上传开发文件：src、scripts、node_modules、package.json、vite.config.js

第四步：网站访问测试（2分钟）

1. 浏览器打开你的域名

2. 页面出现专属加载动画，输入昵称进入公共大厅

3. 点击创建房间，自动生成6位独立房间编号

4. 将域名+房间号分享给好友

5. 好友访问域名，输入房间号即可加入聊天 搭建完成

自检清单

☑ phpMyAdmin数据库内存在rooms、messages两张数据表

☑ config.php文件数据库账号、密码、地址全部修改正确

☑ 网站根目录包含index.html、assets文件夹、php-api文件夹

☑ 域名打开可正常展示加载动画

☑ 输入昵称能正常进入大厅页面

☑ 新建房间可正常生成6位房间号

☑ 其他用户输入房间号可成功加入房间

常见问题修复方案

1. 访问域名页面空白检查assets文件夹是否完整上传，缺失JS、CSS文件会直接页面空白

2. 创建房间提示失败

① 核对config.php数据库配置信息是否填写正确

② 浏览器直接访问  域名/php-api/rooms.php  查看详细报错信息

3. 好友输入房间号提示房间不存在

① 确认php-api文件夹完整上传至网站根目录

② 确认database.sql脚本已成功导入数据库完成建表

③ 再次核对config.php数据库配置4. 发送消息对方看不到消息默认3秒自动同步刷新，等待片刻即可；长时间无同步查看PHP运行报错日志

5. 数据库报错：Access denied for user数据库账号、密码填写错误，重新修改config.php配置文件

6. 页面文字出现中文乱码导入database.sql数据库文件时，编码格式选择utf8mb4

源码截图

源码下载