PricingLoginStart free
Bootcamp i backendudvikling med Node.js · Lektion

Introduktion til WebSockets

Forstå WebSocket-protokollen, dens fordele frem for HTTP til realtidskommunikation og den grundlæggende opsætning.

Lektion 1 af 611 trin

Introduktion til WebSockets er en gratis Bootcamp i backendudvikling med Node.js-lektion på CoddyKit. Dette er lektion 1 af 6. 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 Bootcamp i backendudvikling med Node.js, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Bootcamp i backendudvikling med Node.js-kurset indeholder 6 lektioner i alt.

Velkommen til WebSockets

Velkommen til WebSockets-verdenen! I denne lektion introduceres en effektiv protokol til kommunikation i realtid mellem klienter (f.eks. din browser) og servere.

I modsætning til traditionel HTTP tillader WebSockets en vedvarende forbindelse i begge retninger, så liveopdateringer og interaktive oplevelser bliver mulige.

Hvorfor realtid er vigtigt

Tænk på apps som chatbeskedtjenester, live-resultattavler for sport eller redigeringsværktøjer til samarbejde om dokumenter. De har alle brug for øjeblikkelige opdateringer uden konstant genindlæsning.

  • Chatapps: Beskeder vises med det samme.
  • Live-dashboarder: Data opdateres, efterhånden som de ændrer sig.
  • Spil: Interaktion med lav latenstid.

Det er her, WebSockets virkelig viser deres styrke!

HTTP: Anmodning og svar

Før WebSockets var det meste webkommunikation baseret på HTTP. HTTP bruger en model med anmodning og svar:

  • Klienten sender en anmodning til serveren.
  • Serveren behandler den og sender et svar tilbage.

Hver interaktion opretter en ny forbindelse, hvilket er ineffektivt ved konstant dataudveksling i realtid.

WebSockets: En vedvarende forbindelse

WebSockets opretter en vedvarende kommunikationskanal i begge retninger over en enkelt TCP-forbindelse.

Det betyder:

  • Både klienten og serveren kan sende data til hinanden når som helst.
  • Der er ikke behov for konstant at åbne og lukke forbindelser.
  • Langt mindre overhead ved løbende kommunikation.

WebSocket-håndtrykket

En WebSocket-forbindelse starter med en almindelig HTTP-anmodning, men den indeholder en særlig header:

Upgrade: websocket
Connection: Upgrade

Dette "håndtryk" fortæller serveren, at klienten vil skifte protokol. Hvis serveren accepterer, bliver forbindelsen "opgraderet" til WebSocket, og kommunikationen i realtid kan begynde!

ws:// og wss://

Ligesom HTTP har http:// og https://, bruger WebSockets deres egne URI-skemaer:

  • ws://: Til ukrypterede WebSocket-forbindelser.
  • wss://: Til krypterede WebSocket-forbindelser (sikre og anbefalede i produktion).

De angiver protokollen og adressen på den server, der skal oprettes forbindelse til.

Centrale WebSocket-hændelser

WebSockets er hændelsesbaserede. Din applikationskode lytter efter bestemte hændelser for at håndtere kommunikationen:

  • onopen: Forbindelsen er oprettet.
  • onmessage: Data er modtaget fra serveren.
  • onclose: Forbindelsen er lukket.
  • onerror: Der opstod en fejl.

Disse hændelser gør det muligt at reagere på forbindelsens livscyklus.

En simpel klientforbindelse

Her er et grundlæggende JavaScript-eksempel på, hvordan en klient (f.eks. en webbrowser) opretter en WebSocket-forbindelse og lytter efter hændelser. Denne kode køres typisk i et browsermiljø.

const socket = new WebSocket('ws://localhost:8080');

socket.onopen = (event) => {
  console.log('Connected to WebSocket server!');
  socket.send('Hello from client!');
};

socket.onmessage = (event) => {
  console.log('Message from server:', event.data);
};

socket.onclose = (event) => {
  console.log('Disconnected:', event.code, event.reason);
};

socket.onerror = (error) => {
  console.error('WebSocket Error:', error);
};

Anvendelsesområder for WebSocket

WebSockets er ideelle til applikationer, der kræver dataudveksling i realtid med lav latenstid. Nogle almindelige eksempler er:

  • Online-chatapplikationer: Øjeblikkelig levering af beskeder.
  • Live-feeds og dashboarder: Aktiekurser, sportsresultater, analyser.
  • Online-spil med flere spillere: Spillerinteraktioner i realtid.
  • Samarbejdsværktøjer: Fælles redigering af dokumenter.

Kontrol af WebSocket-protokollen

Lad os kontrollere din forståelse af WebSockets sammenlignet med HTTP.

Besvar den i den interaktive lektion

Opsummering og det næste

Godt gået! Du har netop lært det grundlæggende om WebSockets.

  • WebSockets giver vedvarende kommunikation i begge retninger.
  • De starter med et HTTP-håndtryk og bliver derefter opgraderet.
  • De er perfekte til applikationer i realtid som chat og liveopdateringer.
  • De vigtigste hændelser omfatter open, message, close og error.

Dernæst dykker vi ned i implementeringen af Socket.IO i Node.js for at bygge effektive funktioner i realtid!

Gratis at komme i gang

Lær JavaScript 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
22
Lektioner
92
Start gratisSe hele kurset

Ofte stillede spørgsmål

Er lektionen “Introduktion til WebSockets” gratis?

Ja — hele teksten til “Introduktion til WebSockets” 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 Bootcamp i backendudvikling med Node.js-kurset, skal du opgradere til CoddyKit PRO. Bootcamp i backendudvikling med Node.js-kurset indeholder 6 lektioner i alt.

Hvad lærer jeg i “Introduktion til WebSockets”?

Forstå WebSocket-protokollen, dens fordele frem for HTTP til realtidskommunikation og den grundlæggende opsætning. Du øver dig i Bootcamp i backendudvikling med Node.js 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å Bootcamp i backendudvikling med Node.js?

Der kræves ingen tidligere erfaring. Bootcamp i backendudvikling med Node.js 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 1 af 6.

Hvor lang tid tager lektionen “Introduktion til WebSockets”?

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 Bootcamp i backendudvikling med Node.js-lektion?

Ja. Alle Bootcamp i backendudvikling med Node.js-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

  1. Introduktion til WebSockets
  2. WebSockets med NestJS
  3. Implementering af Socket.IO i Node.js
  4. Konfiguration af gateways
  5. Opbygning af en chatapplikation i realtid
  6. Realtidschatapplikation
← Tilbage til Bootcamp i backendudvikling med Node.js