在线聊天应用

为课程实验开发的实时聊天应用程序。它允许多个用户使用唯一用户名加入聊天室，并实时交换消息。

简介

课程实验作业

这是一个简单但功能齐全的实时网页聊天应用，用于展示如何使用 WebSocket 实现即时通信。用户可以选择一个用户名并开始与其他连接到服务器的用户聊天。

功能特色

• 实时消息传递： 使用 Socket.IO 实现消息的即时发送与接收。
• 唯一用户名： 确保聊天室中的每位用户都有独一无二的用户名。
• 用户列表： 显示当前活跃在线的用户列表。
• 系统消息提示： 用户加入或离开时会有系统通知提示。
• 简洁界面： 提供一个简单易用的网页聊天界面。

技术栈

• 后端： Node.js、Express.js
• 实时通信： Socket.IO
• 前端： HTML、CSS、JavaScript（客户端）
• 包管理器： pnpm
• API 文档： Swagger（访问路径为 /api-docs）

前置条件

在开始之前，请确保你已安装以下工具：

• Node.js（包含 npm）
• pnpm（可通过 npm 安装：npm install -g pnpm）

快速开始

安装步骤

1. 克隆项目仓库（如果尚未克隆）：

git clone https://github.com/liangdengwang/online-chat.git
cd online-chat

2. 使用 pnpm 安装依赖：

pnpm install

启动应用

1. 启动服务器：

pnpm start

或者：

node server.js

2. 打开浏览器访问：http://localhost:3000（或 server.js 中指定的端口）

API 文档

Swagger UI 提供了 API 文档页面。服务器运行后可通过以下地址访问： http://localhost:3000/api-docs

项目结构

• server.js：后端主服务文件，基于 Express 与 Socket.IO 实现。

• public/：存放静态前端资源的目录。

  • index.html：聊天界面的主 HTML 文件。
  • client.js：客户端 JavaScript，用于处理 Socket.IO 通信和 DOM 操作。
  • style.css：聊天应用的样式文件。

• package.json：项目元信息与依赖管理。

• README.md：当前这个说明文档。