Home > Article > Backend Development > How to use Flask-SocketIO to implement real-time web applications

How to use Flask-SocketIO to implement real-time web applications

王林Original: 2023-08-03 13:07:43980browse

How to use Flask-SocketIO to implement real-time Web applications

Introduction:
With the development of Web applications, users have higher and higher demands for real-time interaction and instant updates. The traditional HTTP protocol cannot meet these needs, and the WebSocket protocol provides a real-time communication solution. In Python, Flask-SocketIO is a powerful library that can help us quickly implement real-time web applications. This article will introduce how to use Flask-SocketIO to build a simple real-time chat room.

Preparation
First, we need to install the Flask-SocketIO library. You can use the pip command to install:
```
pip install flask-socketio
```
Configure Flask-SocketIO
In your Flask application, configure SocketIO by importing Flask-SocketIO:
```
from flask import Flask, render_template
from flask_socketio import SocketIO

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
socketio = SocketIO(app)
```
In the above code, we create a Flask application and set a SECRET_KEY. SECRET_KEY is used to encrypt WebSocket communications and is a randomly generated string by default. Then, we created a SocketIO object and associated it with the Flask application.
Create routes and event handlers
Next, we need to create routes and event handlers. In a Flask application, use the @socketio.on decorator to register event handlers. The following is a simple example:
```
@app.route('/')
def index():
 return render_template('index.html')

@socketio.on('message')
def handle_message(message):
 print('received message: ' + message)
 socketio.emit('message', message, broadcast=True)
```
In the above code, we first define a route /, and the corresponding view function returns a function named index.html template. Next, we use the @socketio.on decorator to register a handler for the message event. When the server receives the message event, it calls the handle_message function and passes the message to it as a parameter. The handle_message function prints the received message and broadcasts the message to all connected clients through the socketio.emit method.

Create HTML templates
In the root directory of the project, create a folder named templates and create a folder named inside it. index.html file. Here is a simple example:

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>实时聊天室</title>
 <script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
</head>
<body>
 <h1>实时聊天室</h1>
 <div id="messages"></div>
 <div id="input">
     <input type="text" id="message">
     <button id="send">发送</button>
 </div>

 <script>
     var socket = io();

     document.getElementById('send').onclick = function() {
         var message = document.getElementById('message').value;
         socket.emit('message', message);
     };

     socket.on('message', function(message) {
         var div = document.createElement('div');
         div.textContent = message;
         document.getElementById('messages').appendChild(div);
     });
 </script>
</body>
</html>

In the above code, we pass fc1ca288f9c18414e7329c17899ab61e2cacc6d41bbb37262a98f745aa00fbf0Introduces the Socket.IO client library. We then created an instance of Socket.IO and used the socket.emit method to send a message when the send button is clicked. At the same time, we use the socket.on method to listen to the message event sent by the server and display it on the page when the message is received.

Start the application
After completing the above steps, we can start the application through the following command:
```
python your_app.py
```
where your_app.py is yours The entry file name of the Flask application. After starting the application, visit http://localhost:5000 in the browser, and you can see a simple real-time chat room! Enter a message there and click the send button, the message will be displayed instantly on the page and broadcast to all clients connected to the server.

Summary:
This article introduces how to use Flask-SocketIO to build a simple real-time chat room. By configuring Flask-SocketIO and writing event handlers, we can easily implement operations on WebSocket. The powerful functions of Flask-SocketIO can bring great convenience and flexibility to the development of our real-time web applications.

Code samples are also provided here for you to refer to and experiment on your own. In actual applications, you can combine other functions of Flask-SocketIO, such as room management, namespace, etc., to implement more complex real-time applications. I hope this article will help you understand and use Flask-SocketIO!

The above is the detailed content of How to use Flask-SocketIO to implement real-time web applications. For more information, please follow other related articles on the PHP Chinese website!

Python flask html pip 命名空间字符串 JS 对象事件 http https websocket

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：How to build a RESTful API using Flask-RESTfulNext article：How to build a RESTful API using Flask-RESTful

See more

How to use Flask-SocketIO to implement real-time web applications

Related articles