websocket项目 聊天室

1.项目概述

这个项目是一个基本的实时聊天应用，适用于小型团队或群体。提供了多个聊天室供用户选择。可以通过该代码进行进一步的扩展和定制，例如添加聊天机器人、改进界面等。

2.技术栈

flask，boostrapt，websocket，twemoji

3.项目结构

4.关键特点

1. Web框架： 项目使用 Flask 作为Web框架，这是一个轻量级的Python Web框架，适用于小型应用和快速开发。

2. 实时聊天功能： 使用 Flask-SocketIO 扩展实现了实时双向通信，支持 WebSocket，使得用户可以在聊天页面实时收发消息。

3. WebSocket 事件： 通过 @socketio.on 装饰器定义了处理聊天消息和加载历史消息的两个 WebSocket 事件。消息会被广播到同一聊天室内的所有用户。

4. 聊天记录保存： 使用字典 chat_history 来保存聊天记录，每个聊天室对应一个列表，列表中包含字典形式的消息历史记录。

5. 消息加载事件： 提供了一个用于加载历史消息的 WebSocket 事件，允许客户端加载之前的聊天记录。

6. Socket.IO和Emoji库引入： 引入了 Socket.IO 和 Emoji 库，分别用于实现 WebSocket 连接和处理表情。

7. 动态页面内容： 使用 Flask 的模板引擎在页面中插入了动态内容，如用户名和聊天室名称，通过 {{ username }} 和 {{ chatroom }} 来获取后端传递的变量。

8. Emoji Picker： 包含一个 Emoji 选择器按钮，点击后可以显示/隐藏 Emoji Picker。Emoji Picker 使用了 Twemoji 库来渲染和处理表情。

9. 加载历史消息： 页面加载时通过 WebSocket 事件 load_history 请求加载历史消息，并通过 history 事件接收并显示历史消息。

5.演示效果：

登录页面

聊天页面