JavaScript Academy · Oppitunti

Yhteyden elinkaari ja virheet

Käsitelkää open-, close- ja error-tapahtumia.

Oppitunti 3/413 vaihetta

Yhteyden elinkaari ja virheet on ilmainen JavaScript Academy-oppitunti CoddyKitissä. Tämä on oppitunti 3/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu JavaScript Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. JavaScript Academy-kurssilla on yhteensä 4 oppituntia.

Koko elinkaari

Socket siirtyy tilasta CONNECTING tilaan OPEN, siitä tilaan CLOSING ja lopulta tilaan CLOSED. Näitä siirtymiä vastaavat neljä tapahtumaa: open, message, error ja close.

onclose-tapahtuma

onclose suoritetaan, kun yhteys päättyy, hallitusti tai odottamatta. Tapahtuma sisältää ominaisuudet code, reason ja wasClean.

socket.onclose = (event) => {
  console.log("Closed", event.code, event.reason, event.wasClean);
};

Sulkemiskoodit

Vakiokoodeja ovat esimerkiksi 1000 (normaali), 1001 (poistuminen), 1006 (poikkeava, ei sulkemiskehystä) ja 1011 (palvelinvirhe). Koodit 4000–4999 ovat sovelluksen määritettävissä.

socket.onclose = (e) => {
  if (e.code === 1000) console.log("normal close");
  else console.log("unexpected", e.code);
};

Hallitusti sulkeminen

socket.close(code, reason) aloittaa hallitun sammutuksen. Käyttäkää normaaliin sulkemiseen koodia 1000; reason-merkkijonon on oltava alle 123 tavua pitkä.

socket.close(1000, "user logged out");

onerror-tapahtuma

onerror suoritetaan virhetilanteissa. Tietoturvasyistä virhetapahtuma sisältää tarkoituksella vain vähän tietoja — se ei sisällä tarkkaa syytä. Tapahtuma close seuraa lähes aina.

socket.onerror = (event) => {
  console.log("Socket error — a close will follow");
};

Hallitun ja poikkeavan sulkemisen erottaminen

event.wasClean on true vain, kun molemmat osapuolet ovat vaihtaneet sulkemiskehykset. Katkennut verkkoyhteys antaa arvoksi wasClean: false ja koodiksi 1006.

socket.onclose = (e) => {
  if (!e.wasClean) console.log("Connection dropped unexpectedly");
};

Resurssien vapauttaminen

Tyhjentäkää sulkemisen yhteydessä ajastimet, kuten heartbeat-ajastimet, hylätkää odottavat pyynnöt ja päivittäkää käyttöliittymän tila niin, että sovellus näyttää yhteyden katkenneen.

socket.onclose = () => {
  clearInterval(heartbeatTimer);
  pending.forEach((reject) => reject(new Error("disconnected")));
  pending.clear();
};

Kuuntelijoiden poistaminen

Jos liititte käsittelijät komennolla addEventListener, poistakaa ne yhteyden sulkeutuessa muistivuotojen välttämiseksi, erityisesti kun luotte socketin uudelleen.

function cleanup() {
  socket.removeEventListener("message", onMessage);
  socket.removeEventListener("close", onClose);
}

readyState sammutuksen aikana

close()-kutsun ja onclose-tapahtuman välissä readyState on CLOSING (2). Tänä aikana lähetetyt viestit ohitetaan.

socket.close();
console.log(socket.readyState); // 2 (CLOSING)

Palvelinten käyttämättömyysaikakatkaisut

Palvelimet ja välityspalvelimet sulkevat usein käyttämättömät yhteydet 30–60 sekunnin kuluttua. Heartbeat-viestit pitävät yhteyden aktiivisena ja auttavat havaitsemaan katkeamiset nopeasti.

Katkenneen yhteyden havaitseminen

Yhdistäkää heartbeat-viestit watchdog-valvontaan: jos pong-vastausta ei saavu määräajassa, käsitelkää socket katkenneena ja sulkekaa se uudelleenyhdistämisen käynnistämiseksi.

let pongTimer;
function ping() {
  socket.send(JSON.stringify({ type: "ping" }));
  pongTimer = setTimeout(() => socket.close(4000, "no pong"), 5000);
}
socket.onmessage = (e) => {
  if (JSON.parse(e.data).type === "pong") clearTimeout(pongTimer);
};

Pikatarkistus

Testatkaa elinkaaren käsittelyä.

Kertaus: elinkaari ja virheet

Käsittelitte tapahtuman onclose ja sen ominaisuudet code, reason ja wasClean, opitte vakiomuotoiset sulkemiskoodit, suljitte yhteyden hallitusti, käsittelitte niukasti tietoja sisältävän tapahtuman onerror, vapautitte ajastimet ja kuuntelijat sekä rakensitte heartbeat-valvonnan. Seuraavaksi: uudelleenyhdistämisstrategiat.

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
59
Oppitunnit
200

Usein kysytyt kysymykset

Onko oppitunti ”Yhteyden elinkaari ja virheet” ilmainen?

Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa JavaScript Academy-oppimispolun 3 oppituntia, myös oppitunnin “Yhteyden elinkaari ja virheet”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. JavaScript Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Yhteyden elinkaari ja virheet”?

Käsitelkää open-, close- ja error-tapahtumia. Harjoittelet JavaScript Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni JavaScript Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin JavaScript Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 3/4.

Kuinka kauan ”Yhteyden elinkaari ja virheet”-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ä JavaScript Academy-oppitunnilla?

Kyllä. Jokainen JavaScript Academy-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

  1. WebSocket-yhteyden avaaminen
  2. Viestien lähettäminen ja vastaanottaminen
  3. Yhteyden elinkaari ja virheet
  4. Uudelleenyhdistämisstrategiat
← Takaisin: JavaScript Academy