Jak działa sieć, część II: Co się dzieje, gdy odwiedzasz adres URL

Opublikowany: 2016-12-06

W poprzednim poście mówiliśmy o tym, jak powstała sieć. W tym poście przejedziemy się i zobaczymy, co się dzieje, gdy odwiedzasz adres URL w przeglądarce. Przyjrzymy się również współczesnym technologiom używanym w sieci i ich wzajemnym dopasowaniu.

Zaangażowanych technologii, od momentu naciśnięcia przycisku Enter do przeglądania strony internetowej, jest wiele. W naszym poprzednim poście mówiliśmy o hipertekście i HTTP, ale to był dopiero początek:

Serwery WWW (takie jak apache2 i nginx) implementują protokół HTTP wraz z kilkoma innymi funkcjami, które umożliwiają przeglądarkom internetowym łączenie się, żądanie i odbieranie danych internetowych. HTTP to kanał, przez który wiadomości, strony internetowe, obrazy i zasoby „podróżują” między serwerem internetowym a przeglądarką.

Współczesna sieć jest dość wymagająca, a nowoczesne serwery internetowe sprostały temu wyzwaniu. Skalowalność i bezpieczeństwo to dwie główne troski dzisiejszego świata. Nowoczesne serwery WWW są wysoce skalowalne (obsługują ponad 10 000 jednoczesnych połączeń), zapewniają wiele opcji równoważenia obciążenia, obsługują SSL/TLS i HTTP/2. Kluczowym ulepszeniem HTTP/2 w stosunku do HTTP/1.1 jest niewątpliwie lepsze zarządzanie strumieniowaniem pakietów. Strumieniowe przesyłanie wideo jest dziś wszechobecne, a protokół HTTP/1.1 nie był w stanie odpowiednio zaspokoić potrzeb wszystkich dzisiejszych urządzeń, przepustowości sieci i liczby użytkowników Internetu.

HTML (HyperText Markup Language) to język, który używa znaczników do reprezentowania ustrukturyzowanych dokumentów hipertekstowych, które mogą być zrozumiane przez przeglądarkę internetową.

Jego najnowsze wcielenie, HTML5, wprowadziło wiele ulepszeń językowych i porządków, ale najbardziej imponującymi dodatkami były natywne wsparcie wideo i audio, grafika 2D i 3D, a także lokalna baza danych. Te ulepszenia skutecznie przestarzały technologie multimedialne, takie jak Flash i Silverlight.

CSS (Cascading Style-sheets) to technologia używana przez projektantów stron internetowych w celu ułatwienia wizualnych zmian na wielu stronach internetowych.

Kod CSS może znajdować się w HTML lub, jak zwykle, są to oddzielne pliki, do których odwołuje się strona HTML. Przydatność CSS polega na tym, że oddziela on treść od prezentacji, dając projektantom stron internetowych potężne narzędzie do centralnego zarządzania wszystkimi szczegółami estetycznymi witryny.

Back-end (na przykład PHP lub Java) to kod zmieszany z HTML, który jest wykonywany przez serwer sieciowy po zakończeniu obliczeń.

Obecnie wszystkie strony internetowe są dynamiczne; co oznacza, że przeglądarka nie obsługuje już żadnych prostych plików .html. Wszystkie nowoczesne języki, z dodatkiem bibliotek oprogramowania zwanych frameworkami internetowymi, mogą być używane jako rozwiązanie zaplecza dla witryny internetowej. Niedawne wydanie PHP 7 i wspaniałe ulepszenia wydajności oraz wprowadzone przez nie funkcje, a także HHVM Facebooka, przeniosły cały proces na wyższy poziom.

Front-end (Javascript) to kod również mieszany z HTML, ale jest wykonywany lokalnie na Twoim komputerze przez przeglądarkę internetową.

Być może najbardziej zdumiewającym i imponującym osiągnięciem we współczesnej sieci był Javascript. Z prostego, młodszego brata Javy, używanego do tworzenia menu i wyświetlania wyskakujących okienek, przeszedł do potężnego języka programowania używanego zarówno w kliencie, jak i na serwerze. W dzisiejszych czasach może zrobić wszystko w przeglądarce internetowej i z dużą szybkością. Silnik JavaScript V8 firmy Google był głównym technologicznym przełomem.

Co się dzieje, gdy odwiedzasz adres URL

Sieć to róg obfitości różnych technologii, ale istnieją dwie koncepcje, których podstawowa funkcja pozostała niezmieniona nawet dzisiaj. Przeglądarka internetowa i serwer WWW. Działają one na „starym” modelu klient/serwer, który wygląda następująco: Klient łączy się z serwerem za pomocą adresu (IP lub nazwy) i czegoś żąda. Serwer następnie odpowiada klientowi i tak dalej. Klienci łączą się z serwerami, ale nie odwrotnie. Chociaż dzisiejsza technologia sieciowa znacząco zmieniła ten model, użyjemy go do wyjaśnienia procesu w uproszczony sposób.

Odpalasz więc swoją ulubioną przeglądarkę i odwiedzasz stronę internetową. Od momentu naciśnięcia klawisza Enter do ostatecznego wyświetlenia strony, dzieją się następujące rzeczy:

Twoja przeglądarka najpierw wywołuje moduł oprogramowania zwany resolwerem DNS, który jest skonfigurowany na Twoim komputerze i prosi o adres IP, który odpowiada wprowadzonemu adresowi URL.
DNS (Domain Name System) to podstawowa usługa internetowa, która mapuje nazwy komputerów (takie jak www.pressidium.com ) na adresy IP. Adresy IP są tym, co komputery połączone z Internetem rozumieją i z którymi mogą się łączyć. W następnym wpisie dowiemy się, co to jest i jak działa.
Twoja przeglądarka inicjuje wówczas połączenie z tym adresem IP, korzystając z portu 80 lub 443.
Adres IP oznacza serwer, a numer portu odnosi się do usługi, z którą chcesz się połączyć. Wszystkie serwery internetowe działają domyślnie na porcie 80, podczas gdy port 443 jest używany do bezpiecznych połączeń internetowych.
Serwer sieciowy przetwarza wprowadzony adres URL i przekazuje kontrolę zapleczu. Kod zaplecza generuje stronę HTML i przekazuje ją do serwera WWW. Serwer WWW w końcu wysyła stronę HTML do przeglądarki za pośrednictwem kanału HTTP.
W milisekundach potrzebnych serwerowi WWW do odesłania kodu HTML dzieje się wiele rzeczy. Kod zaplecza na stronie internetowej zwykle łączy się z bazą danych, wykonuje zapytania, odzyskuje dane, kontaktuje się z innymi usługami zaplecza i ostatecznie składa wszystko w dokument HTML. To nie jest tak naprawdę dyskretny plik, o który prosisz, ale zasób dynamiczny , który jest generowany na bieżąco przy użyciu szerokiej gamy różnych technologii i komponentów.
Twoja przeglądarka internetowa odbiera stronę HTML, zamyka połączenie z serwerem sieciowym, a następnie wyświetla ją na ekranie. Wykonuje kod JavaScript obecny w HTML. Nowoczesne projektowanie stron internetowych jest zgodne z podejściem zwanym Responsive Design. Podejście to wykorzystuje HTML, CSS i JavaScript do dynamicznego dostosowywania układu strony internetowej, w zależności od urządzenia używanego do przeglądania. Stało się to bardzo ważne w dzisiejszych czasach wraz z gwałtownym rozwojem urządzeń mobilnych i tabletów.

Co dalej?

Do tej pory pokrótce omówiliśmy różne nowoczesne technologie internetowe oraz to, co się dzieje, gdy odwiedzasz adres URL. Niewątpliwie technologie internetowe są złożone i liczne i nie da się ich satysfakcjonująco opisać w jednym artykule. Celem tej serii postów jest przede wszystkim przedstawienie Internetu i sieci „z lotu ptaka”.
W kolejnej odsłonie tej ciekawej serii odwiedzimy kolejną ważną infrastrukturę internetową, System Nazw Domen. Bez niej nic by się naprawdę nie udało! (przynajmniej dla nas ludzi).