Node.js-taustakehityksen bootcamp · Oppitunti

WebSocketsin perusteet

Opitte WebSocket-protokollan, sen edut HTTP:hen verrattuna reaaliaikaisessa viestinnässä sekä perusmääritykset.

Oppitunti 1/611 vaihetta

WebSocketsin perusteet on ilmainen Node.js-taustakehityksen bootcamp-oppitunti CoddyKitissä. Tämä on oppitunti 1/6. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Node.js-taustakehityksen bootcamp-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Node.js-taustakehityksen bootcamp-kurssilla on yhteensä 6 oppituntia.

Tervetuloa WebSocketien pariin

Tervetuloa WebSockets-maailmaan! Tässä oppitunnissa esitellään tehokas protokolla reaaliaikaiseen viestintään asiakkaiden (kuten selaimesi) ja palvelinten välillä.

Toisin kuin perinteinen HTTP, WebSockets mahdollistaa pysyvän kaksisuuntaisen yhteyden, mikä tekee reaaliaikaisista päivityksistä ja vuorovaikutteisista kokemuksista mahdollisia.

Miksi reaaliaikaisuus on tärkeää

Ajattele esimerkiksi chat-sovelluksia, reaaliaikaisia urheilutulostauluja tai yhteistyössä muokattavia asiakirjoja. Kaikki tarvitsevat välittömiä päivityksiä ilman jatkuvaa päivittämistä.

Chat-sovellukset: Viestit näkyvät heti.
Reaaliaikaiset koontinäytöt: Tiedot päivittyvät niiden muuttuessa.
Pelaaminen: Pienen viiveen vuorovaikutus.

Tässä WebSockets on parhaimmillaan!

HTTP: pyyntö ja vastaus

Ennen WebSocketsia suurin osa verkkoviestinnästä perustui HTTP:hen. HTTP käyttää pyyntö–vastaus-mallia:

Asiakas lähettää pyynnön palvelimelle.
Palvelin käsittelee sen ja lähettää vastauksen takaisin.

Jokainen vuorovaikutus muodostaa uuden yhteyden, mikä on tehotonta jatkuvassa, reaaliaikaisessa tiedonsiirrossa.

WebSockets: pysyvä yhteys

WebSockets muodostaa pysyvän, full-duplex-viestintäkanavan yhden TCP-yhteyden kautta.

Tämä tarkoittaa seuraavaa:

Sekä asiakas että palvelin voivat lähettää tietoja toisilleen milloin tahansa.
Yhteyksiä ei tarvitse jatkuvasti avata ja sulkea.
Jatkuvan viestinnän aiheuttama kuormitus on paljon pienempi.

WebSocket-kättely

WebSocket-yhteys alkaa tavallisella HTTP-pyynnöllä, mutta se sisältää erityiset otsakkeet:

Upgrade: websocket
Connection: Upgrade

Tämä ”kättely” kertoo palvelimelle, että asiakas haluaa vaihtaa protokollaa. Jos palvelin hyväksyy, yhteys ”päivitetään” WebSocket-yhteydeksi, ja reaaliaikainen viestintä voi alkaa!

ws:// ja wss://

Aivan kuten HTTP käyttää osoitteita http:// ja https://, WebSockets käyttää omia URI-mallejaan:

ws://: Salaamattomille WebSocket-yhteyksille.
wss://: Salatuille WebSocket-yhteyksille (suojattu ja suositeltava tuotantokäytössä).

Näissä määritetään käytettävä protokolla ja palvelimen osoite, johon yhdistetään.

WebSocketin keskeiset tapahtumat

WebSockets perustuu tapahtumiin. Sovelluskoodisi kuuntelee tiettyjä tapahtumia viestinnän käsittelemiseksi:

onopen: Yhteys muodostettiin onnistuneesti.
onmessage: Palvelimelta vastaanotettiin tietoja.
onclose: Yhteys suljettiin.
onerror: Tapahtui virhe.

Näiden tapahtumien avulla voit reagoida yhteyden elinkaaren eri vaiheisiin.

Yksinkertainen asiakasyhteys

Tässä on perusesimerkki JavaScriptillä siitä, miten asiakas (kuten verkkoselain) muodostaa WebSocket-yhteyden ja kuuntelee tapahtumia. Tämä koodi suoritetaan yleensä selainympäristössä.

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);
};

WebSocketin käyttötapaukset

WebSockets sopii erinomaisesti sovelluksiin, jotka tarvitsevat pienen viiveen ja reaaliaikaisen tiedonsiirron. Yleisiä esimerkkejä ovat:

Verkossa toimivat chat-sovellukset: Viestit toimitetaan heti.
Reaaliaikaiset syötteet ja koontinäytöt: Osakekurssit, urheilutulokset ja analytiikka.
Moninpelit: Pelaajien reaaliaikainen vuorovaikutus.
Yhteistyötyökalut: Jaettujen asiakirjojen muokkaaminen.

WebSocket-protokollan testi

Tarkistetaan, miten hyvin ymmärrät WebSocketsin ja HTTP:n erot.

Vastaa interaktiivisessa oppitunnissa

Yhteenveto ja seuraavat vaiheet

Hienoa työtä! Olet juuri oppinut WebSocketsin perusteet.

WebSockets tarjoaa pysyvän, full-duplex-viestinnän.
Yhteys alkaa HTTP-kättelyllä ja päivitetään sen jälkeen.
WebSockets sopii erinomaisesti reaaliaikaisiin sovelluksiin, kuten chatiin ja reaaliaikaisiin päivityksiin.
Keskeisiä tapahtumia ovat open, message, close ja error.

Seuraavaksi perehdymme Socket.IO:n toteuttamiseen Node.js:ssä tehokkaiden reaaliaikaisten ominaisuuksien rakentamiseksi!

Aloita maksutta

Opi JavaScript tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit: 22
Oppitunnit: 92

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”WebSocketsin perusteet” ilmainen?

Kyllä – oppitunnin ”WebSocketsin perusteet” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Node.js-taustakehityksen bootcamp-kurssin, päivitä CoddyKit PROhon. Node.js-taustakehityksen bootcamp-kurssilla on yhteensä 6 oppituntia.

Mitä opin oppitunnilla ”WebSocketsin perusteet”?

Opitte WebSocket-protokollan, sen edut HTTP:hen verrattuna reaaliaikaisessa viestinnässä sekä perusmääritykset. Harjoittelet Node.js-taustakehityksen bootcamp-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Node.js-taustakehityksen bootcamp-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Node.js-taustakehityksen bootcamp-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/6.

Kuinka kauan ”WebSocketsin perusteet”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Node.js-taustakehityksen bootcamp-oppitunnilla?

Kyllä. Jokainen Node.js-taustakehityksen bootcamp-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

← Takaisin: Node.js-taustakehityksen bootcamp