Livechat- og gamingservere
Undersøg udfordringer og løsninger ved udvikling af højtydende livechat-platforme og backends til multiplayer-spil.
Livechat- og gamingservere er en gratis WebSockets og programmering af realtidssystemer-lektion på CoddyKit. Dette er lektion 2 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i WebSockets og programmering af realtidssystemer, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. WebSockets og programmering af realtidssystemer-kurset indeholder 4 lektioner i alt.
Realtidskrav i chat og spil
Livechatprogrammer og multiplayer-spil er det ypperste eksempel på kommunikation i realtid. De kræver øjeblikkelige opdateringer, lav latenstid og effektiv dataudveksling mellem mange brugere.
Traditionel HTTP med sin anmodnings-svar-model egner sig simpelthen ikke til dette konstante, tovejs flow af information. Det er her, WebSockets virkelig udmærker sig.
Håndtering af latenstid og gennemløb
En af de største udfordringer er at sikre lav latenstid, så meddelelser og handlinger i spillet ankommer næsten øjeblikkeligt. Et højt gennemløb er også afgørende for at kunne håndtere mange meddelelser i sekundet.
- Chat: Meddelelser skal vises med det samme.
- Spil: Spillerbevægelser, angreb og point skal synkroniseres uden mærkbar forsinkelse.
WebSockets leverer en vedvarende forbindelse, som minimerer overhead sammenlignet med gentagne HTTP-anmodninger, og det hjælper med at nå disse mål.
Håndtering af dynamisk tilstand
I både chat og spil skal serveren håndtere dynamisk tilstand. Det omfatter:
- Hvilke brugere der er online.
- Hvem der befinder sig i hvilket chatrum eller hvilken spilsession.
- Spillernes positioner, helbred og point i et spil.
- Den seneste chathistorik.
Denne tilstand ligger ofte i hukommelsen af hensyn til hastigheden, men kan også gemmes i en database til gendannelse eller historik på lang sigt.
Strukturering med rum og kanaler
For at håndtere kommunikation mellem mange brugere bruger vi ofte rum eller kanaler. I stedet for at sende hver meddelelse til alle brugere dirigeres meddelelserne til bestemte grupper.
- Et chatrum for et bestemt emne.
- En spillobby eller en aktiv spilinstans.
Denne tilgang reducerer netværkstrafikken og serverbelastningen betydeligt ved kun at sende data derhen, hvor de er nødvendige.
Serveren: Deltagelse i et chatrum
Dette Node.js-eksempel opretter en WebSocket-server. Klienter kan sende en joinRoom-meddelelse for at blive en del af et bestemt chatrum. Serveren bruger en Map til at holde styr på aktive rum og deres tilsluttede klienter.
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
const rooms = new Map(); // Map: roomName -> Set<WebSocket>
wss.on('connection', ws => {
console.log('Client connected.');
ws.on('message', message => {
const msg = JSON.parse(message);
if (msg.type === 'joinRoom') {
const roomName = msg.room;
if (!rooms.has(roomName)) {
rooms.set(roomName, new Set());
}
rooms.get(roomName).add(ws);
ws.currentRoom = roomName; // Store room on connection
ws.send(`You joined: ${roomName}`);
console.log(`Client joined room '${roomName}'`);
}
});
ws.on('close', () => {
if (ws.currentRoom) {
rooms.get(ws.currentRoom).delete(ws);
if (rooms.get(ws.currentRoom).size === 0) {
rooms.delete(ws.currentRoom);
}
}
console.log('Client disconnected.');
});
ws.send('Send {\"type\": \"joinRoom\", \"room\": \"lobby\"}');
});
console.log('WebSocket server running on port 8080.');Udsendelse og målrettet levering
Når klienterne er i rum, skal serveren sende meddelelser effektivt:
- Broadcast: Til alle klienter i et bestemt rum (f.eks. en offentlig chatmeddelelse).
- Unicast: Til en enkelt, bestemt klient (f.eks. en privat meddelelse eller en spilkommando til én spiller).
Denne målrettede levering er afgørende for at holde programmet responsivt og forhindre unødvendig dataoverførsel.
Serveren: Udsendelse af chatmeddelelser
Med udgangspunkt i rumkonceptet viser denne kode, hvordan serveren kan modtage en chatmeddelelse og udsende den til alle andre klienter i det samme rum. Bemærk, hvordan den gennemløber Set-samlingen af klienter i det aktuelle rum.
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
const rooms = new Map(); // Map: roomName -> Set<WebSocket>
wss.on('connection', ws => {
ws.on('message', message => {
const msg = JSON.parse(message);
if (msg.type === 'joinRoom') {
const roomName = msg.room;
if (!rooms.has(roomName)) {
rooms.set(roomName, new Set());
}
rooms.get(roomName).add(ws);
ws.currentRoom = roomName;
ws.send(`You joined: ${roomName}`);
} else if (msg.type === 'chat' && ws.currentRoom) {
const roomClients = rooms.get(ws.currentRoom);
roomClients.forEach(client => {
if (client.readyState === WebSocket.OPEN) {
client.send(`[${ws.currentRoom}] User says: ${msg.text}`);
}
});
}
});
ws.on('close', () => {
if (ws.currentRoom) {
rooms.get(ws.currentRoom).delete(ws);
if (rooms.get(ws.currentRoom).size === 0) {
rooms.delete(ws.currentRoom);
}
}
});
ws.send('Send {\"type\": \"joinRoom\", \"room\": \"lobby\"} then {\"type\": \"chat\", \"text\": \"Hello!\"}');
});
console.log('WebSocket server running on port 8080.');Klientens brugerflade og reaktionsevne
På klientsiden (f.eks. i en webbrowser) bruger JavaScript den indbyggede WebSocket-API til at oprette forbindelse og håndtere meddelelser. Brugerfladen opdateres dynamisk uden genindlæsning af siden.
Dette eksempel viser en grundlæggende HTML-struktur og JavaScript til at oprette forbindelse, deltage i et rum og vise indgående meddelelser.
<!DOCTYPE html>
<html>
<head>
<title>Chat Client</title>
</head>
<body>
<div id="messages" style="border: 1px solid #ccc; height: 150px; overflow-y: scroll; padding: 5px;"></div>
<input type="text" id="chatInput" placeholder="Type your message...">
<button onclick="sendMessage()">Send</button>
<script>
const ws = new WebSocket('ws://localhost:8080');
const messagesDiv = document.getElementById('messages');
const chatInput = document.getElementById('chatInput');
ws.onopen = () => {
messagesDiv.innerHTML += '<p><em>Connected!</em></p>';
ws.send(JSON.stringify({ type: 'joinRoom', room: 'lobby' }));
};
ws.onmessage = event => {
messagesDiv.innerHTML += `<p>${event.data}</p>`;
messagesDiv.scrollTop = messagesDiv.scrollHeight; // Auto-scroll
};
function sendMessage() {
const text = chatInput.value;
if (text.trim() !== '') {
ws.send(JSON.stringify({ type: 'chat', text: text }));
chatInput.value = '';
}
}
</script>
</body>
</html>Synkronisering af spiltilstand
I multiplayer-spil er synkronisering af spiltilstand afgørende. Det handler om mere end blot chatmeddelelser; spillerpositioner, helbred, point og begivenheder i spillet skal løbende opdateres på alle tilsluttede klienter.
- Serveren som autoritet: Serveren fungerer ofte som den eneste sandhedskilde for spiltilstanden.
- Spilloop: En spilloop på serversiden beregner og udsender ofte ændringer i tilstanden til klienterne.
Teknikker som interpolation og ekstrapolation på klienten hjælper med at udjævne visuelle opdateringer på trods af netværkslatenstid.
Vigtige realtidsudfordringer
Overvej de typiske krav til at bygge en robust livechat- eller multiplayer-spilserver ved hjælp af WebSockets. Hvilke af følgende udgør væsentlige udfordringer?
Opsummering: Bygning af realtidsprogrammer
I denne lektion har vi undersøgt de særlige udfordringer ved at bygge livechat- og multiplayer-spilservere med WebSockets. Vi har lært:
- Det afgørende behov for lav latenstid og højt gennemløb.
- Strategier til håndtering af dynamisk tilstand for brugere, rum og spillelementer.
- Betydningen af rumbaserede meddelelser for effektiv kommunikation.
- Hvordan servere håndterer deltagelse i rum og udsendelse af meddelelser, samt hvordan klienter opdaterer deres brugerflade.
- Konceptet synkronisering af spiltilstand for interaktive oplevelser.
Disse principper danner grundlaget for at skabe engagerende og responsive realtidsprogrammer.
Lær WebSockets og programmering af realtidssystemer med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 12
- Lektioner
- 47
Ofte stillede spørgsmål
Er lektionen “Livechat- og gamingservere” gratis?
Ja — hele teksten til “Livechat- og gamingservere” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af WebSockets og programmering af realtidssystemer-kurset, skal du opgradere til CoddyKit PRO. WebSockets og programmering af realtidssystemer-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Livechat- og gamingservere”?
Undersøg udfordringer og løsninger ved udvikling af højtydende livechat-platforme og backends til multiplayer-spil. Du øver dig i WebSockets og programmering af realtidssystemer med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på WebSockets og programmering af realtidssystemer?
Der kræves ingen tidligere erfaring. WebSockets og programmering af realtidssystemer på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 2 af 4.
Hvor lang tid tager lektionen “Livechat- og gamingservere”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne WebSockets og programmering af realtidssystemer-lektion?
Ja. Alle WebSockets og programmering af realtidssystemer-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Samarbejdsredigering og whiteboards
- Livechat- og gamingservere
- Realtime-dashboards med data
- Opbygning af et realtidsbaseret lokationssporingssystem