En este tutorial, aprenderemos a utilizar Python Flask y SocketIO para crear una aplicación web que permita a los usuarios chatear en tiempo real. SocketIO es una librería que nos permite establecer conexiones bidireccionales en tiempo real entre el cliente y el servidor, lo que es ideal para aplicaciones de chat en tiempo real.
Para empezar, necesitaremos tener instalado Python en nuestro sistema. Si no lo tienes instalado, puedes descargarlo desde el sitio web oficial de Python. También necesitaremos instalar Flask y Flask-SocketIO, que son las librerías que utilizaremos para crear nuestra aplicación. Puedes instalarlas ejecutando los siguientes comandos en tu terminal:
pip install Flask
pip install Flask-SocketIO
Una vez que tengamos Python y las librerías instaladas, estaremos listos para empezar a escribir nuestro código.
Primero, crearemos un archivo llamado app.py
donde escribiremos nuestro código:
from flask import Flask, render_template
from flask_socketio import SocketIO, emit
app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
socketio = SocketIO(app)
@app.route('/')
def index():
return render_template('index.html')
@socketio.on('message')
def handle_message(msg):
print('Message: ' + msg)
emit('message', msg, broadcast=True)
if __name__ == '__main__':
socketio.run(app)
En este código, estamos importando las librerías necesarias y creando una instancia de la aplicación Flask y del objeto SocketIO. Luego, definimos una ruta raíz que renderiza nuestro archivo HTML index.html
. También definimos una función handle_message
que se activará cuando el servidor reciba un mensaje del cliente. Esta función imprimirá el mensaje en la consola y luego emitirá el mensaje a todos los clientes conectados.
A continuación, crearemos un archivo llamado index.html
en la carpeta templates
dentro de nuestro directorio de trabajo:
<!DOCTYPE html>
<html>
<head>
<title>Chat en tiempo real</title>
</head>
<body>
<input type="text" id="messageInput">
<button onclick="sendMessage()">Enviar</button>
<ul id="messages"></ul>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.2.0/socket.io.js"></script>
<script>
var socket = io();
socket.on('message', function(msg) {
var li = document.createElement('li');
li.innerHTML = msg;
document.getElementById('messages').appendChild(li);
});
function sendMessage() {
var message = document.getElementById('messageInput').value;
socket.emit('message', message);
}
</script>
</body>
</html>
En este archivo HTML, creamos un cuadro de entrada de texto donde el usuario podrá escribir mensajes y un botón para enviar los mensajes al servidor. También tenemos una lista desordenada donde se mostrarán los mensajes enviados por los usuarios. Utilizamos la librería Socket.IO para establecer una conexión entre el cliente y el servidor y para manejar los mensajes entrantes y salientes.
Para ejecutar nuestra aplicación, simplemente debemos correr el archivo app.py
desde la terminal:
python app.py
Una vez que la aplicación esté en funcionamiento, puedes abrir tu navegador y navegar a http://localhost:5000
para ver la página de inicio de la aplicación. Puedes probar la funcionalidad de chat enviando mensajes desde diferentes pestañas del navegador y viendo cómo se muestran en tiempo real en todas las pestañas.
¡Y eso es todo! Ahora tienes una aplicación de chat en tiempo real construida con Python Flask y SocketIO. Puedes personalizar y expandir esta aplicación según tus necesidades, como agregar autenticación de usuarios, guardar el historial de mensajes, o implementar salas de chat separadas. ¡Diviértete explorando las posibilidades de SocketIO y Flask!
07:53 Enviar y recibir mensajes
¿Hay alguna forma de hacer q el socket se ejecute mediante hilos?
Si quisiera enviar audio del clirnte al servidor …. ¿cómo sería el código? Saludos.
Alguien me puede ayudar por favor hice un proyecto Flask con Socketio igual que el vídeo pero ahora que a lo termine tengo problemas para subirlo al servidor, estoy subiendo el proyecto con un cPanel y he tenido demasiados problemas por favor alguien que me pueda ayudar con este problema, alguien que me pudiera explicar los pasos para subir un sitio web con flask y Socketio
te hago otra pegunta ya que estoy y que tal vez la sabes responder, no se que merda toque pero se me conecta como varias veces , osea en la terminal me aparece muchisimas veces " – [20/Jun/2021 10:34:02] "GET /socket.io/?EIO=4&transport=polling&t=Nefe6uR&sid=FNFwr8rgnLAzGpnjAAAE HTTP/1.1" 200 – – – [20/Jun/2021 10:34:02] "POST /socket.io/?EIO=4&transport=polling&t=NefeC_W&sid=FNFwr8rgnLAzGpnjAAAE HTTP/1.1" 200 -" y asi se repite y se repite … Yo me acuerdo cuando habia hecho un socket en su tiempo con Node funcionaba perfecto solo me aparecia una vez conectado , luego creo que instale no se que mierda el "dotenv" y empezo tambien a desconectarse y conectarse … a que se debe esto ? estoy con linux
sabes lo que estaria piola ? que hagas un video , tipo socket io con flask y agregarlo a un chat de flutter (creo que ese video pegaria bastante, ya que son algunas combinaciones que no se ven en youtube) . Por otro lado algo que tampoco veo son videos tipo "como migrar de tal lenguaje a tal lenguaje" . Por ejemplo de Python a Dart , diciendo "una clase se escribe asi y aca asi " y asi para todos los puntos .
saludos genio tus videos siempre (para mi) fueron uno de los mas nutritivos de youtube.
Por que al realizar las líneas de programación, en la línea número 1 la primera palabra flask me aparece subrayada (como error), y por lo cual no se ejecuta el programa?
Hola, este video ya esta viejito asi que para los nuevos que vengan recuerden que en python las funciones se escriben diferente a JavaScript, todo en minusculas y separado pofr guion bajo
en este caso seria
def handle_message
Como podria utilizar este codigo y mandar a internet el html?
hola, tengo un problema y es que no me pinta los mensajes del lado del cliente me pueden ayudar, gracias
comparto los archivos en drive: https://drive.google.com/drive/folders/1yrhM5Z6kOZhG8ZZCvz93KixMzyINpNug?usp=sharing
Muy interesante. Y en el caso de que se necesitara enviar los mensajes a un cliente específico? Cual podria ser el camino
Gracias Fazt
Hola, una pregunta, sí quisiera acceder de manera remota a traves de otros equipos conectados a la misma red a mi app de flask, que deberia configurar en el servidor o como deberia guardar el proyecto? podrías darme algún consejo?
Hay alguna forma de poder abrir el localhost desde tu movil?
@Fazt hola, tengo una duda, como puedo utilizar SocketIO para tomar un archivo de la base de datos y gargar en el html sin que este se actualice?
El servidor no me quiere abrir
Muchas gracias
Gracias por el aporte, Tengo una pregunta habra alguna manera de que todas las imagenes que tengo en una carpeta las pueda importar de manera randon en un slide usando flask?
Muchas gracias
Genial. Me gustó esto. <3 Gracias.