Verständnisfrage zu Fastapi/Websocket - Clientdaten
Verfasst: Sonntag 3. November 2024, 14:26
Hallöle,
bin auf dieses Beispiel
https://fastapi.tiangolo.com/advanced/w ... le-clients
gestoßen, und habe etwas experimentiert, woraus sich die ein oder andere Frage ergibt.
Es soll kein ernsthaftes / praktikables Projekt werden sondern lediglich Übung.
Hätte es gerne so dass User über ihren Benutzernamen angesprochen werden können: z.B Flüstern, Nick-Farbe ändern.
Siehe im Code Unten
Dachte erst an ein Dict k=Username v=Socket, allerdings sind der noch mehr Informationen wie z.B Hexfarbe für den Namen daher vermute ich, ist wohl eine Userclass nötig, allerdings habe ich noch keinen wirklichen Ansatz dass umzusetzen.
bin auf dieses Beispiel
https://fastapi.tiangolo.com/advanced/w ... le-clients
gestoßen, und habe etwas experimentiert, woraus sich die ein oder andere Frage ergibt.
Es soll kein ernsthaftes / praktikables Projekt werden sondern lediglich Übung.
Hätte es gerne so dass User über ihren Benutzernamen angesprochen werden können: z.B Flüstern, Nick-Farbe ändern.
Siehe im Code Unten
Code: Alles auswählen
#Benutzername1 an Benutzername2 (Kommando: /whisper Benutzername2 Hallo du Nudel!)
Code: Alles auswählen
from fastapi import FastAPI, WebSocket, WebSocketDisconnect
from fastapi.responses import HTMLResponse
app = FastAPI()
html = """
<!DOCTYPE html>
<html>
<head>
<title>Chat</title>
</head>
<body>
<h1>WebSocket Chat</h1>
<h2>Your ID: <span id="ws-id"></span></h2>
<form action="" onsubmit="sendMessage(event)">
<input type="text" id="messageText" autocomplete="off"/>
<button>Send</button>
</form>
<ul id='messages'>
</ul>
<script>
var client_id = Date.now()
document.querySelector("#ws-id").textContent = client_id;
var ws = new WebSocket(`ws://localhost:8000/ws/${client_id}`);
ws.onmessage = function(event) {
var messages = document.getElementById('messages')
var message = document.createElement('li')
var content = document.createTextNode(event.data)
message.appendChild(content)
messages.appendChild(message)
};
function sendMessage(event) {
var input = document.getElementById("messageText")
ws.send(input.value)
input.value = ''
event.preventDefault()
}
</script>
</body>
</html>
"""
#Benutzerklasse
class User(Username: str, Color: str, Socket: WebSocket):
def __init__(self):
self.Benutzername = Username
self.Color = Color
self.Socket = Socket
...
class ConnectionManager:
def __init__(self):
self.active_connections: list[WebSocket] = []
async def connect(self, websocket: WebSocket):
await websocket.accept()
self.active_connections.append(websocket)
def disconnect(self, websocket: WebSocket):
self.active_connections.remove(websocket)
async def send_personal_message(self, message: str, websocket: WebSocket):
await websocket.send_text(message)
async def broadcast(self, message: str):
for connection in self.active_connections:
await connection.send_text(message)
manager = ConnectionManager()
@app.get("/")
async def get():
return HTMLResponse(html)
@app.websocket("/ws/{client_id}")
async def websocket_endpoint(websocket: WebSocket, client_id: int):
await manager.connect(websocket)
newUser = User(client_id, "#DD00DD", websocket)
try:
while True:
data = await websocket.receive_text()
#Benutzername1 an Benutzername2 (Kommando: /whisper Benutzername2 Hallo du Nudel!)
if data[0:3] == "/whisper ":
data2 = data.split(" ", 2)
Empfaenger_Name = data2[1]
Empfaenger_Message = data2[2]
#Hier müsste nun rausgefunden werden welches websocket-Objekt Benutzer2 hat.
await manager.send_personal_message(f"You wrote: {data}", websocket)
await manager.broadcast(f"Client #{client_id} says: {data}")
except WebSocketDisconnect:
manager.disconnect(websocket)
await manager.broadcast(f"Client #{client_id} left the chat")