🌐 Jak funguje web: klient, server, HTTP

Jako pošta

O čem to je

Napíšeš do prohlížeče sprtam.cz a za chvíli vidíš stránku. Mezi tím se odehraje celý rozhovor dvou počítačů. Jeden se ptá, druhý odpovídá.

Když tomu rozhovoru rozumíš, víš, proč stránka někdy hlásí „404“, proč má zámek v adresním řádku a kde hledat chybu, když web nejde. Na tom stojí celá práce webového vývojáře.

Nové pojmy

KlientProgram, který o něco žádá. Na webu je to skoro vždy prohlížeč (Chrome, Firefox, Safari).Tvůj prohlížeč v mobilu je klient.

ServerPočítač s programem, který čeká na žádosti a posílá odpovědi. Běží nepřetržitě, často v datovém centru.Počítač, na kterém leží soubory webu školy.

Požadavek a odpověďPožadavek (anglicky request) posílá klient: „Pošli mi tuhle stránku.“ Odpověď (response) posílá server: obsah stránky nebo zprávu, proč to nejde.Požadavek: „Dej mi /rozvrh.“ Odpověď: HTML stránka s rozvrhem.

Web jako pošta

Představ si, že píšeš dopis do knihovny: „Pošlete mi prosím knihu Babička.“ Na obálku napíšeš adresu knihovny. Pošta dopis doručí, knihovna ho přečte a pošle zpátky balík s knihou, nebo lístek „Tu knihu nemáme“.

Pošta	Web
ty, kdo píše dopis	klient (prohlížeč)
knihovna	server
adresa na obálce	URL
dopis s prosbou	požadavek HTTP
balík nebo lístek „nemáme“	odpověď HTTP se stavovým kódem
pravidla, jak psát dopis	protokol HTTP

ProtokolDohodnutá pravidla, jak spolu dva počítače mluví: kdo začíná, v jakém tvaru se ptá a jak odpovídá.HTTP je protokol webu. Díky němu si rozumí jakýkoli prohlížeč s jakýmkoli serverem.

HTTPHyperText Transfer Protocol. Protokol, kterým si prohlížeč a server posílají požadavky a odpovědi.Prohlížeč pošle „GET /index.html“, server odpoví „200 OK“ a pošle stránku.

Adresa: URL

URLUniform Resource Locator, adresa jedné věci na webu. Říká, jakým protokolem, na který server a pro jaký soubor se jde.https://www.skola.cz/rozvrh?trida=1A#pondeli

Část	V příkladu	Co znamená
schéma	https	jakým protokolem se mluví
host (doména)	www.skola.cz	který server
cesta	/rozvrh	která stránka na serveru
parametry (query)	?trida=1A	upřesnění pro server
fragment	#pondeli	místo na stránce; server ho nedostane, řeší ho prohlížeč

DNSDomain Name System, „telefonní seznam internetu“. Převádí jméno domény na IP adresu, tedy číslo, podle kterého se server v síti najde.Prohlížeč se DNS zeptá na www.skola.cz a dostane třeba 192.0.2.10.

Co server odpoví: stavové kódy

Stavový kódTrojmístné číslo na začátku každé odpovědi. První číslice říká skupinu: 2xx povedlo se, 3xx jdi jinam, 4xx chyba na straně klienta, 5xx chyba na straně serveru.404 Not Found: stránka na této adrese neexistuje.

Roztřiď kódy do krabiček. Stačí se dívat na první číslici.

Napíšeš adresu https://www.skola.cz/rozvrhh (s překlepem). Jaký kód asi dostaneš a čí je to chyba?

Server stránku /rozvrhh nemá, takže pošle 404 Not Found. Kód začíná 4, tedy chyba je v požadavku klienta: špatná adresa. Server funguje.

Web školy po aktualizaci vrací všem 500. Kde hledat chybu?

Kód 500 začíná 5, chyba je na serveru. Požadavky jsou v pořádku, ale program na serveru spadl. Správce se má podívat do logů serveru, ne do prohlížeče žáků.

Zámek v adresním řádku: HTTPS

HTTPSHTTP, které jede uvnitř šifrovaného spojení (TLS). Nikdo po cestě nepřečte ani nezmění, co si klient a server posílají. Server navíc certifikátem dokazuje, že je opravdu ten, za koho se vydává.Přihlášení do školního systému musí jít přes https://, jinak by heslo šlo po síti čitelně.

U pošty je to rozdíl mezi pohlednicí a zalepenou obálkou. HTTP je pohlednice: každý pošťák ji může přečíst. HTTPS je zalepená obálka.

✗Web má zámek a https, takže je bezpečný a dá se mu věřit.

✓HTTPS jen zaručuje, že spojení je šifrované a že doména patří tomu, kdo má certifikát. Podvodná stránka může mít HTTPS taky.

Certifikát pro svou doménu si zdarma pořídí kdokoli, i podvodník. Zámek neříká nic o poctivosti obsahu.

Klient (prohlížeč) posílá serveru požadavek HTTP na nějakou URL a server vrátí odpověď se stavovým kódem: 2xx v pořádku, 3xx jinam, 4xx chyba klienta, 5xx chyba serveru. HTTPS je totéž, jen v šifrovaném spojení.

Krok za krokem

O čem to je

Od stisku Enter po hotovou stránku uplyne zlomek sekundy. Za tu dobu proběhne několik přesně daných kroků. Projdeme je jeden po druhém.

Kdo zná kroky, umí najít, který z nich selhal. To je základ ladění webu i práce na helpdesku.

Nové pojmy

Klient a serverKlient je program, který žádá (prohlížeč). Server je počítač, který na žádosti čeká a odpovídá. Tomuto rozdělení rolí se říká model klient–server.Prohlížeč = klient, počítač s webem e-shopu = server.

IP adresaČíslo, podle kterého se počítač najde v síti. Je to jako číslo domu.192.0.2.10 (IPv4) nebo 2001:db8::10 (IPv6).

Doména a DNSDoména je jméno, které si člověk zapamatuje (skola.cz). DNS je služba, která jméno přeloží na IP adresu.skola.cz → 192.0.2.10

PortČíslo „dveří“ na serveru. Jeden server může nabízet víc služeb a každá poslouchá na jiném portu.HTTP běží standardně na portu 80, HTTPS na portu 443.

HTTP a HTTPSHTTP je protokol (soubor pravidel), kterým prohlížeč žádá o stránky. HTTPS je HTTP uvnitř šifrovaného spojení TLS.https://sprtam.cz se načítá přes HTTPS.

Cesta jedné stránky

Prohlížeč rozloží URL: schéma https, host www.skola.cz, cesta /rozvrh.

Zeptá se DNS na IP adresu hostu www.skola.cz.

Naváže spojení se serverem na portu 443 (u https).

Domluví se se serverem na šifrování (TLS) a ověří jeho certifikát.

Pošle požadavek HTTP: metoda GET, cesta /rozvrh.

Server požadavek zpracuje a pošle odpověď: stavový kód 200 a HTML.

Prohlížeč HTML přečte a pro každý obrázek, styl a skript pošle další požadavek.

Ze všeho poskládá stránku a vykreslí ji.

Metody: co chci se serverem udělat

Metoda HTTPSlovo na začátku požadavku. Říká, co klient chce: číst, poslat, změnit, nebo smazat.GET /rozvrh = „dej mi rozvrh“.

Metoda	K čemu	Příklad
GET	získat data, nic nemění	otevřít stránku, načíst obrázek
POST	poslat nová data na server	odeslat formulář, přidat komentář
PUT	nahradit celý záznam	uložit upravený profil
PATCH	změnit část záznamu	změnit jen e-mail
DELETE	smazat	smazat komentář

GET posílá parametry přímo v URL (za otazníkem). Proto se GET nehodí pro hesla: URL se ukládá do historie prohlížeče i do logů serveru. Formulář s heslem se posílá metodou POST, kde jsou data v těle požadavku.

Odpověď: stavové kódy

Stavový kódTrojmístné číslo v odpovědi serveru. Podle první číslice se pozná, jak to dopadlo.200 = v pořádku, 404 = nenalezeno.

Skupina	Význam	Častý kód
2xx	úspěch	200 OK, 201 Created
3xx	přesměrování, hledej jinde	301 Moved Permanently, 304 Not Modified
4xx	chyba klienta (špatný požadavek)	400 Bad Request, 401 Unauthorized, 403 Forbidden, 404 Not Found
5xx	chyba serveru	500 Internal Server Error, 503 Service Unavailable

401 – Nejsi přihlášený (chybí ověření).
403 – Jsi známý, ale sem nesmíš (zakázáno).
301 – Stránka se trvale přestěhovala na jinou URL.
503 – Server je dočasně nedostupný (přetížený, údržba).

Zkus si u každé kartičky nejdřív říct význam nahlas a pak ji otoč.

Žák odešle přihlašovací formulář a dostane 401. Je chyba v serveru?

Kód začíná 4, jde o chybu na straně klienta. 401 Unauthorized znamená, že ověření selhalo nebo chybí. Nejspíš špatné heslo, server funguje správně.

Urči části URL https://eshop.cz:8443/kosik?mena=czk#souhrn.

Schéma https, host eshop.cz, port 8443 (uvedený výslovně, jinak by byl 443), cesta /kosik, parametr mena=czk, fragment souhrn (zůstane v prohlížeči).

✗Chyba 404 znamená, že spadl server.

✓404 znamená, že server běží a odpověděl, jen na dané adrese nic nemá.

Kódy 4xx popisují chybu v požadavku klienta. Když server nefunguje, vrací 5xx, nebo se prohlížeč k němu nepřipojí vůbec.

Prohlížeč přes DNS najde IP adresu serveru, připojí se (u HTTPS šifrovaně na portu 443) a pošle požadavek s metodou, např. GET. Server vrátí stavový kód a obsah. Podle první číslice kódu víš, kde hledat chybu.

🧱HTML: struktura dokumentu a sémantické značky