Maison > Article > développement back-end > Comment utiliser Flask-SocketIO pour implémenter des applications de communication en temps réel

Comment utiliser Flask-SocketIO pour implémenter des applications de communication en temps réel

王林original: 2023-08-03 21:57:221377parcourir

Comment utiliser Flask-SocketIO pour mettre en œuvre des applications de communication en temps réel

Introduction :
Dans les applications Web, la communication en temps réel est une fonction très importante, qui permet aux utilisateurs d'échanger des informations en temps réel ou de recevoir des données poussées par le serveur dans temps réel. Flask-SocketIO est un plug-in basé sur le framework Flask, qui offre la possibilité d'utiliser WebSocket pour établir une communication en temps réel. Cet article expliquera comment utiliser Flask-SocketIO pour implémenter une application simple de communication en temps réel.

Préparation :
Tout d'abord, nous devons installer le plugin Flask-SocketIO. Il peut être installé via la commande suivante :

pip install flask-socketio

De plus, nous devons également installer la bibliothèque JavaScript Socket.IO pour une communication en temps réel sur le front-end. Il peut être installé avec la commande suivante :

npm install socket.io-client

Une fois ces préparatifs terminés, nous pouvons commencer à écrire du code.

Exemple de code :
Ce qui suit est un simple exemple de code d'application de communication en temps réel Flask-SocketIO :

Introduire les bibliothèques et modules nécessaires

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

Créer une application Flask et configurer

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

Définir le routage et gestion des événements Fonction

@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')

Créer un fichier HTML frontal
Créez un fichier nommé index.html dans le répertoire racine du projet et ajoutez le code suivant :

<!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>

Démarrez l'application
Ajoutez le code suivant dans le fichier d'entrée pour démarrer l'application :
```
if __name__ == '__main__':
 socketio.run(app, debug=True)
```

Après avoir exécuté l'application, visitez http://localhost:5000 dans le navigateur et vous verrez une simple interface d'application de communication en temps réel. Entrez un message dans la zone de saisie du message et cliquez sur le bouton d'envoi pour réaliser la fonction d'envoi et de réception de messages en temps réel.

Résumé :
Cet article présente comment utiliser Flask-SocketIO pour implémenter des applications de communication en temps réel. Grâce au plug-in Flask-SocketIO, nous pouvons facilement et rapidement créer une application de communication en temps réel pour réaliser la transmission de messages en temps réel entre le serveur et le client. J'espère que cet article pourra vous aider à comprendre comment utiliser Flask-SocketIO pour implémenter des applications de communication en temps réel.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

JavaScript flask html 事件 http websocket

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Comment créer des applications Web hautes performances avec DjangoArticle suivant：Comment créer des applications Web hautes performances avec Django

Articles Liés

Voir plus