Categories flask

Flask实现一个在线聊天工具

Leave a comment by

在Flask中实现聊天工具的主要插件是 Flask-SocketIO，它是Flask的一个扩展，提供了对WebSockets的支持，能够实现实时通信，这是实现聊天应用的关键。

以下是一个完整的示例，展示了如何使用Flask-SocketIO创建一个简单的聊天应用：

1. 安装依赖

首先，确保你安装了Flask和Flask-SocketIO。使用pip进行安装：

pip install Flask Flask-SocketIO

2. 创建Flask应用

创建一个新的Python文件，比如app.py，并添加以下代码：

from flask import Flask, render_template
from flask_socketio import SocketIO, send

app = Flask(__name__)
app.config['SECRET_KEY'] = 'your_secret_key'
socketio = SocketIO(app)

@app.route('/')
def index():
    return render_template('index.html')

@socketio.on('message')
def handle_message(msg):
    print('Message: ' + msg)
    send(msg, broadcast=True)

if __name__ == '__main__':
    socketio.run(app, debug=True)

3. 创建模板文件

在同一目录下创建一个templates文件夹，并在其中创建一个index.html文件：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Chat</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.0/socket.io.js"></script>
    <script type="text/javascript" charset="utf-8">
        document.addEventListener('DOMContentLoaded', (event) => {
            var socket = io.connect('http://' + document.domain + ':' + location.port);
            socket.on('connect', () => {
                socket.send('User has connected!');
            });
            socket.on('message', (msg) => {
                var li = document.createElement("li");
                li.appendChild(document.createTextNode(msg));
                document.getElementById("messages").appendChild(li);
            });
            document.getElementById("sendbutton").onclick = () => {
                var msg = document.getElementById("myMessage").value;
                socket.send(msg);
                document.getElementById("myMessage").value = '';
            };
        });
    </script>
</head>
<body>
    <ul id="messages"></ul>
    <input type="text" id="myMessage">
    <button id="sendbutton">Send</button>
</body>
</html>

4. 运行应用

在终端中运行你的Flask应用：

python app.py

打开浏览器并访问http://127.0.0.1:5000/，你将看到一个简单的聊天界面。你可以在多个浏览器窗口中打开该页面，并尝试发送消息。每条消息都会广播给所有连接的客户端。

这个简单的聊天应用示例展示了如何使用Flask-SocketIO实现基本的实时通信。你可以根据需要扩展和优化这个基础示例，例如添加用户身份验证、存储聊天记录、实现私人聊天等功能。

Leave a Comment