Natuurlijk! Hier is een overzicht van hoe je Flask kunt uitbreiden met Websockets door gebruik te maken van Flask-SocketIO, inclusief praktische voorbeelden en tips: **1. Installatie van benodigde packages** Installeer Flask-SocketIO en een geschikte async-server zoals eventlet of gevent: ```bash pip install flask-socketio eventlet ``` **2. Basisintegratie in je Flask-app** Een eenvoudige setup ziet er zo uit: ```python from flask import Flask, render_template from flask_socketio import SocketIO, emit app = Flask(__name__) app.config['SECRET_KEY'] = 'jouw-secret-key' socketio = SocketIO(app, async_mode='eventlet') # of 'gevent' of 'threading' @app.route('/') def index(): return render_template('index.html') # Voorbeeld van een event van client ontvangen @socketio.on('client_event') def handle_client_event(data): print('Ontvangen van client:', data) # Stuur een reactie terug emit('server_response', {'message': 'Data ontvangen!'}, broadcast=True) if __name__ == '__main__': socketio.run(app, host='0.0.0.0', port=5000) ``` **3. Client-side (JavaScript) voorbeeld** In je `index.html` voeg je het volgende toe: ```html <script src="//cdn.socket.io/socket.io-3.0.0.min.js"></script> <script> var socket = io(); // Verbinding maken socket.on('connect', () => { console.log('Verbonden met server'); // Event sturen naar server socket.emit('client_event', {data: 'Hallo server!'}); }); // Ontvangen van berichten van server socket.on('server_response', (data) => { console.log('Reactie van server:', data); }); </script> ``` **4. Connectiebeheer en events** - Gebruik `@socketio.on('event_name')` om te reageren op client events. - Gebruik `emit()` om data terug te sturen. - Je kunt ook rooms gebruiken om groepen clients te beheren: ```python @socketio.on('join_room') def handle_join(data): room = data['room'] join_room(room) emit('status', {'msg': f'Joined room {room}'}, room=room) ``` **5. Schalen van real-time functionaliteit** Omdat Flask-SocketIO op een ASGI/WSGI server draait, moet je voor echte schaalbaarheid: - **Server**: gebruik een multi-process server zoals Gunicorn met de juiste worker class (`gevent` of `eventlet`). - **Nginx**: proxy WebSocket-verkeer door de juiste configuratie: ```nginx location /socket.io/ { proxy_pass http://127.0.0.1:5000/socket.io/; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "Upgrade"; } ``` - **Horizontal schaalbaarheid**: voor meerdere Flask/SocketIO instanties moet je een message broker gebruiken zoals Redis: ```python socketio = SocketIO(app, message_queue='redis://localhost:6379') ``` Dit zorgt dat events tussen verschillende processen en servers gesynchroniseerd worden. **Samenvatting:** - Installeer Flask-SocketIO en een async-server. - Integreer het in je Flask app en definieer events. - Gebruik JavaScript client-side om te verbinden en events te sturen/ontvangen. - Beheer connecties en rooms voor groepsfunctionaliteiten. - Voor schaalbaarheid, gebruik Redis en configureer je Nginx correct voor WebSocket-verkeer. Met deze aanpak voeg je real-time, bidirectionele communicatie toe aan je bestaande Flask-applicatie, klaar voor schaalbaarheid en verdere uitbreidingen.

Zeker, ik help je graag met het integreren van real-time functionaliteit in je Flask applicatie. Hier is een complete uitleg met voorbeelden specifiek voor jouw architectuur. ## 1. Installatie en Basisopzet Eerst installeer je de benodigde packages: ```bash pip install flask-socketio eventlet ``` **app.py** - Basis Flask-SocketIO configuratie: ```python from flask import Flask, render_template from flask_socketio import SocketIO, emit, join_room, leave_room import os app = Flask(__name__) app.config['SECRET_KEY'] = os.environ.get('SECRET_KEY', 'mijn_geheime_sleutel') socketio = SocketIO(app, cors_allowed_origins="*") # Voor productie: gebruik Redis als message queue # socketio = SocketIO(app, message_queue='redis://localhost:6379/0') @app.route('/') def index(): return render_template('index.html') # Basis connectie events @socketio.on('connect') def handle_connect(): print(f'Client connected: {request.sid}') emit('connection_response', {'data': 'Verbonden met server'}) @socketio.on('disconnect') def handle_disconnect(): print(f'Client disconnected: {request.sid}') if __name__ == '__main__': socketio.run(app, debug=True, host='0.0.0.0') ``` ## 2. Real-time Events en Room Management **Room-based communicatie voor gesprekken/notificaties:** ```python from flask import request from datetime import datetime # Gebruikers sessie beheer connected_users = {} @socketio.on('user_join') def handle_user_join(data): user_id = data['user_id'] connected_users[request.sid] = user_id join_room(f'user_{user_id}') emit('user_status', {'user_id': user_id, 'status': 'online'}, broadcast=True) @socketio.on('join_chat') def handle_join_chat(data): chat_id = data['chat_id'] join_room(f'chat_{chat_id}') emit('chat_joined', {'chat_id': chat_id, 'message': 'Je bent bij de chat gekomen'}) @socketio.on('send_message') def handle_send_message(data): chat_id = data['chat_id'] message = data['message'] # Opslaan in PostgreSQL (voorbeeld) from models import Message, db new_message = Message(chat_id=chat_id, content=message, user_id=connected_users[request.sid]) db.session.add(new_message) db.session.commit() # Broadcast naar room emit('new_message', { 'message': message, 'user_id': connected_users[request.sid], 'timestamp': datetime.now().isoformat() }, room=f'chat_{chat_id}') ``` ## 3. Client-side Implementatie **templates/index.html**: ```html <!DOCTYPE html> <html> <head> <title>Real-time App</title> <script src="https://cdn.socket.io/4.5.0/socket.io.min.js"></script> </head> <body> <div id="messages"></div> <input type="text" id="messageInput"> <button onclick="sendMessage()">Verstuur</button> <script> const socket = io(); const userId = 'gebruiker_123'; // Dynamisch maken in praktijk socket.on('connect', () => { console.log('Verbonden met server'); socket.emit('user_join', {user_id: userId}); }); socket.on('new_message', (data) => { const messagesDiv = document.getElementById('messages'); messagesDiv.innerHTML += `<p>${data.message} - ${data.timestamp}</p>`; }); function sendMessage() { const input = document.getElementById('messageInput'); socket.emit('send_message', { chat_id: 'chat_1', message: input.value }); input.value = ''; } </script> </body> </html> ``` ## 4. Nginx Configuratie voor WebSockets **/etc/nginx/sites-available/your-app**: ```nginx server { listen 80; server_name jouwdomein.nl; location / { proxy_pass http://127.0.0.1:5000; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; proxy_read_timeout 86400; } location /socket.io { proxy_pass http://127.0.0.1:5000/socket.io; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; } } ``` ## 5. Schalen met Multiple Workers Voor productie met meerdere workers: ```python # requirements.txt voeg toe: # redis==4.5.4 # Start meerdere workers met: # socketio.run(app, debug=False, host='0.0.0.0', port=5000) # Gebruiker liever: # gunicorn -k eventlet -w 4 -b 0.0.0.0:5000 app:app ``` **Docker-compose voor schaling**: ```yaml version: '3.8' services: app: build: . command: gunicorn -k eventlet -w 4 -b 0.0.0.0:5000 app:app environment: - REDIS_URL=redis://redis:6379/0 depends_on: - redis redis: image: redis:alpine ports: - "6379:6379" nginx: image: nginx:alpine ports: - "80:80" volumes: - ./nginx.conf:/etc/nginx/nginx.conf ``` ## 6. Geavanceerd: Real-time Database Updates **Database change listeners**: ```python from flask_socketio import emit from models import db, Message def setup_db_listeners(): # Voor PostgreSQL kun je LISTEN/NOTIFY gebruiken # of periodic checks implementeren pass # Alternatief: periodic checks import threading import time def background_thread(): while True: time.sleep(5) # Check voor nieuwe berichten/updates new_messages = Message.query.filter(Message.timestamp > last_check).all() for message in new_messages: socketio.emit('new_message', { 'id': message.id, 'content': message.content }, room=f'chat_{message.chat_id}') ``` ## 7. Beveiliging en Authenticatie ```python from flask import session from flask_login import current_user @socketio.on('connect') def handle_connect(): if not current_user.is_authenticated: return False # Verbinding weigeren join_room(f'user_{current_user.id}') ``` ## Belangrijke Tips: 1. **Use Redis voor sessie clustering** bij multiple workers 2. **Implementeer heartbeat mechanisme** voor connection monitoring 3. **Gebruik rooms** voor efficiënte broadcasting 4. **Beperk events** met rate limiting 5. **Monitor performance** met SocketIO's built-in metrics Deze setup zorgt voor naadloze real-time communicatie terwijl je bestaande PostgreSQL database en Nginx configuratie behouden blijven.