How to use Flask-SocketIO to implement real-time communication applications-Python Tutorial-php.cn

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

王林

Release： 2023-08-03 21:57:22

Original

1414 people have browsed it

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

Introduction:
In Web applications, real-time communication is a very important function, which allows users to exchange information in real time, or in real time Receive data pushed by the server. Flask-SocketIO is a plug-in based on the Flask framework, which provides the ability to use WebSocket to achieve real-time communication. This article will introduce how to use Flask-SocketIO to implement a simple real-time communication application.

Preparation work:
First, we need to install the Flask-SocketIO plug-in. It can be installed through the following command:

pip install flask-socketio

Copy after login

In addition, we also need to install the Socket.IO JavaScript library for real-time communication on the front end. It can be installed through the following command:

npm install socket.io-client

Copy after login

When these preparations are completed, we can start writing code.

Code example:
The following is a simple Flask-SocketIO real-time communication application code example:

Introduce the necessary libraries and modules

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

Copy after login

Create Flask application and configure

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

Copy after login

Define routing and event handling functions

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

@socketio.on('message')
def handle_message(message):
 print('received message: ' + message)
 emit('response', {'data': 'Server response'})

@socketio.on('connect')
def handle_connect():
 print('client connected')

@socketio.on('disconnect')
def handle_disconnect():
 print('client disconnected')

Copy after login

Create front-end HTML file
Create a file named index.html in the project root directory and add the following code:

<!DOCTYPE html>
<html>
<head>
 <title>Real-time Communication</title>
 <script src="//code.jquery.com/jquery-3.5.1.min.js"></script>
 <script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.1/socket.io.js"></script>
</head>
<body>
 <h1>Real-time Communication</h1>
 <input id="message-input" type="text" placeholder="Enter message">
 <button id="send-button">Send</button>
 <div id="response-div"></div>

 <script type="text/javascript">
     var socket = io.connect();

     $('#send-button').click(function() {
         var message = $('#message-input').val();
         socket.emit('message', message);
     });

     socket.on('response', function(data) {
         $('#response-div').text(data.data);
     });
 </script>
</body>
</html>

Copy after login

Start the application
Add the following code to the application's entry file to start the application ：
```
if __name__ == '__main__':
 socketio.run(app, debug=True)
```
Copy after login
After running the application, visit http://localhost:5000 in the browser, and you will see a simple real-time communication application interface. Enter a message in the message input box and click the send button to realize the function of sending and receiving messages in real time.

Summary:
This article introduces how to use Flask-SocketIO to implement real-time communication applications. Through the Flask-SocketIO plug-in, we can easily and quickly build a real-time communication application to realize real-time message transmission between the server and the client. I hope this article can help you understand how to use Flask-SocketIO to implement real-time communication applications.
The above is the detailed content of How to use Flask-SocketIO to implement real-time communication applications. For more information, please follow other related articles on the PHP Chinese website!