Sådan fungerer internettet: En primer for nybegyndere til webudvikling (eller nogen, virkelig)

Hvis du lige kommer ind i webudvikling, er chancerne for, at du tror, ​​du ved, hvordan internettet fungerer - i det mindste på et grundlæggende niveau.

... Men så prøver du at forklare, hvordan et grundlæggende websted fungerer, og tegne et tomt. Hvad betyder en IP-adresse igen? Hvordan fungerer "klientserver" -modellen nøjagtigt?

Udviklingsrammer er stærke i disse dage. Så kraftfuld, faktisk, at det er let for os nyankomne at miste styr på det grundlæggende i, hvordan internettet, du ved, * fungerer. *

Jeg ved, at jeg gjorde det. Ingen skam at indrømme det: Internettet er kompliceret, og det er først, når du begynder at konstruere i backend, at du indser, hvor vigtigt disse grundlæggende er. (Hvis du alligevel vil oprette webapps, der rent faktisk fungerer.)

Så jeg har taget det på mig selv at skrive en fire-delt feltguide til de skræmmende basics, som alle skal have hånd om, uanset om du bare dykker ned i en karriere inden for webudvikling eller bare er interesseret i at lære:

Del 1: Sådan fungerer internettet

Del 2: Struktur af en webapplikation

Del 3: HTTP og REST

Del 4: Kodeeksempler på klient-server-interaktion

En grundlæggende websøgning

Lad os starte et sted, hvor vi alle har været før: Skriv “www.github.com” i din browsers adresselinje og se sideindlæsningen.

Simpelt som den transaktion måske ser ud, sker der masser af magi under emhætten. Lad os dykke lige ned i det.

Definition af dele af internettet

At forstå internettet er skræmmende, fordi der er meget jargon. Desværre er noget af dette jargon afgørende for at forstå resten af ​​dette indlæg.

Her er de vigtigste udtryk, du skal forstå, hvis du vil nappe hemmelighederne på World Wide Web:

Klient: Et program, såsom Chrome eller Firefox, der kører på en computer og har forbindelse til internettet. Dens primære rolle er at tage brugerinteraktioner og oversætte dem til anmodninger til en anden computer kaldet en webserver. Selvom vi typisk bruger en browser til at få adgang til internettet, kan du tænke på hele din computer som "klient" -stykket i klientservermodellen. Hver klientcomputer har en unik adresse kaldet en IP-adresse, som andre computere kan bruge til at identificere den.

Server: En maskine, der er forbundet til internettet og også har en IP-adresse. En server venter på anmodninger fra andre maskiner (f.eks. En klient) og svarer på dem. I modsætning til din computer (dvs. klienten), som også har en IP-adresse, har serveren speciel serversoftware installeret og kører, der fortæller den, hvordan den skal reagere på indgående anmodninger fra din browser. En webservers primære funktion er at gemme, behandle og levere websider til klienter. Der er mange typer servere, herunder webservere, databaseservere, filservere, applikationsservere og mere. (I dette indlæg taler vi om webservere.)

IP-adresse: Internetprotokoladresse. En numerisk identifikator for en enhed (computer, server, printer, router osv.) På et TCP / IP-netværk. Hver computer på internettet har en IP-adresse, som den bruger til at identificere og kommunikere med andre computere. IP-adresser har fire sæt tal adskilt med decimaler (f.eks. 244.155.65.2). Dette kaldes den "logiske adresse". For at finde en enhed i netværket konverteres den logiske IP-adresse til en fysisk adresse af TCP / IP-protokolsoftwaren. Denne fysiske adresse (dvs. MAC-adresse) er indbygget i din hardware.

Internetudbyder: Internetudbyder. ISP er mellemmanden mellem klienten og serverne. For den typiske husejer er internetudbyderen normalt et "kabelfirma." Når din browser får en anmodning fra dig om at gå til www.github.com, ved den ikke, hvor den skal se efter www.github.com. Så det er internetudbyderens opgave at foretage et DNS (Domain Name System) -opslag for at spørge, hvilken IP-adresse det websted, du prøver at besøge, er konfigureret til.

DNS: Domain Name System. En distribueret database, der holder styr på computerens domænenavne og deres tilsvarende IP-adresser på Internettet. Du skal ikke bekymre dig om, hvordan en "distribueret database" fungerer lige nu: Ved bare, at der findes DNS, så brugerne kan indtaste www.github.com i stedet for en IP-adresse.

Domænenavn: Bruges til at identificere en eller flere IP-adresser. Brugere bruger domænenavnet (f.eks. Www.github.com) for at komme til et websted på internettet. Når du skriver domænenavnet i din browser, bruger DNS det til at finde den tilsvarende IP-adresse for det givne websted.

TCP / IP: Transmissionsstyringsprotokol / Internetprotokol. Den mest anvendte kommunikationsprotokol. En "protokol" er simpelthen et standard sæt regler for at gøre noget. TCP / IP bruges som standard til transmission af data over netværk.

Portnummer: Et 16-bit heltal, der identificerer en bestemt port på en server og altid er knyttet til en IP-adresse. Det fungerer som en måde at identificere en bestemt proces på en server, som netværksanmodninger kan videresendes til.

Vært: En computer tilsluttet et netværk - det kan være en klient, server eller enhver anden type enhed. Hver vært har en unik IP-adresse. For et websted som www.google.com kan en vært være den webserver, der betjener siderne for hjemmesiden. Der er ofte en blanding mellem en vært og server, men bemærk at de er to forskellige ting. Servere er en type vært - de er en bestemt maskine. På den anden side kan en vært henvise til en hel organisation, der leverer en hostingtjeneste til at vedligeholde flere webservere. Du kan køre en server fra en vært i den forstand.

HTTP: Hyper-text Transfer Protocol. Protokollen, som webbrowsere og webservere bruger til at kommunikere med hinanden via Internettet.

URL: Uniform Resource Locators. URL'er identificerer en bestemt webressource. Et simpelt eksempel er //github.com/someone. URL'en specificerer protokollen (“https”), værtsnavnet (github.com) og filnavnet (en persons profilside). En bruger kan få den webressource, der er identificeret ved denne URL via HTTP, fra en netværkshost, hvis domænenavn er github.com. (tunge vrider meget ?!)

Rejsen fra kode til webside

Okay, nu hvor vi har de væsentlige definitioner ude af vejen, lad os gå igennem den Github-søgning for at se, hvordan vi går fra en URL, der er skrevet i en adresselinje til en kørende webside:

1) Du skriver en URL i din browser

2) Browseren analyserer oplysningerne i URL'en. Dette inkluderer protokollen (“https”), domænenavnet (“github.com”) og ressourcen (“/”). I dette tilfælde er der ikke noget efter “.com”, der angiver en bestemt ressource, så browseren ved kun at hente hovedsiden (indeks)

3) Browseren kommunikerer med din internetudbyder for at foretage et DNS-opslag af IP-adressen til den webserver, der er vært for www.github.com. DNS-tjenesten kontakter først en rodnavneserver, der ser på //www.github.com og svarer med IP-adressen på en navneserver til topdomænet “.com”. Denne adresse sendes tilbage til din DNS-tjeneste. DNS-tjenesten opsøger endnu en gang til “.com” navneserveren og beder den om adressen til //www.github.com.

kilde: //technet.microsoft.com/en-us/library/bb962069.aspx

4) Når internetudbyderen modtager destinationsserverens IP-adresse, sender den den til din webbrowser

5) Din browser tager IP-adressen og det givne portnummer fra URL'en (HTTP-protokollen er standard til port 80 og HTTPS er standard til port 443) og åbner en TCP-stikforbindelse. På dette tidspunkt er din webbrowser og webserver endelig tilsluttet.

6) Din webbrowser sender en HTTP-anmodning til webserveren til den primære HTML-webside på www.github.com.

7) Webserveren modtager anmodningen og ser efter den HTML-side. Hvis siden findes, forbereder webserveren svaret og sender det tilbage til din browser. Hvis serveren ikke kan finde den ønskede side, sender den en HTTP 404-fejlmeddelelse, der står for "Side blev ikke fundet".

8) Din webbrowser tager den HTML-side, den modtager, og analyserer den gennem en fuldstændig scanning fra hoved til tå på udkig efter andre aktiver, der er anført, såsom billeder, CSS-filer, JavaScript-filer osv.

9) For hvert anført aktiv gentager browseren hele processen ovenfor og fremsætter yderligere HTTP-anmodninger til serveren for hver ressource.

10) Når browseren er færdig med at indlæse alle andre aktiver, der er anført på HTML-siden, indlæses siden endelig i browservinduet, og forbindelsen lukkes

At krydse internetafgrunden

En ting, der er værd at bemærke, er, hvordan oplysninger transmitteres, når du anmoder om oplysninger. Når du fremsætter en anmodning, opdeles disse oplysninger i mange små bidder, der kaldes pakker. Hver pakke er mærket med en TCP-header, som inkluderer kilde- og destinationsportnumrene, og en IP-header, der inkluderer kilde- og destinations-IP-adresserne for at give den sin identitet. Pakken transmitteres derefter via ethernet, WiFi eller mobilnetværk og får lov til at rejse på en hvilken som helst rute og tage så mange humle, som den har brug for for at komme til den endelige destination.

(Vi er ligeglad med, hvordan pakkerne kommer derhen - alt, hvad der betyder noget, er, at de kommer sikkert frem til destinationen!) Når pakkerne når destinationen, samles de igen og leveres som et stykke.

Så hvordan ved alle pakker, hvordan man kommer til deres destination uden at gå tabt?

Svaret er TCP / IP.

TCP / IP er et todelt system, der fungerer som Internets grundlæggende "kontrolsystem". IP står for Internet Protocol; dets opgave er at sende og rute pakker til andre computere ved hjælp af IP-headere (dvs. IP-adresser) på hver pakke. Den anden del, Transmission Control Protocol (TCP), er ansvarlig for at bryde meddelelsen eller filen i mindre pakker, dirigere pakker til den rigtige applikation på destinationscomputeren ved hjælp af TCP-overskrifterne, sende pakkerne igen, hvis de går tabt på vej, og samle pakkerne i den rigtige rækkefølge, når de har nået den anden ende.

Maler det endelige billede

Men vent - jobbet er ikke færdigt endnu! Nu hvor din browser har ressourcerne, der omfatter hjemmesiden (HTML, CSS, JavaScript, billeder osv.), Skal den gennemgå flere trin for at præsentere ressourcerne for dig som en menneskelig læsbar webside.

Din browser har en gengivelsesmotor, der er ansvarlig for at vise indholdet. Gengivelsesmotoren modtager indholdet af ressourcerne i små bidder. Så er der en HTML-parsingsalgoritme, der fortæller browseren, hvordan man analyserer ressourcerne.

Når den er analyseret, genererer den en træstruktur af DOM-elementerne. DOM står for Document Object Model, og det er en konvention til, hvordan man repræsenterer objekter placeret i et HTML-dokument. Disse objekter - eller "noder" - i hvert dokument kan manipuleres ved hjælp af scripting-sprog som JavaScript.

Når DOM-træet er bygget, parses stilarkene for at forstå, hvordan man styler hver knude. Ved hjælp af disse oplysninger krydser browseren DOM-noder ned og beregner CSS-stil, position, koordinater osv. For hver node.

Når browseren har DOM-noder og deres stilarter, er den * endelig * klar til at male siden til din skærm i overensstemmelse hermed. Resultatet: alt hvad du nogensinde har set på Internettet.

Internettet er komplekst, men du er lige færdig med den hårde del

Så det er nettet i en nøddeskal. Faret vild? Det er vi alle sammen, men hvis du har læst så langt, er du allerede færdig med den hårde del. Jeg har tydeligvis sprunget over nogle detaljer for at vise dig det store billede her; men hvis du kan pakke hovedet omkring den grundlæggende rækkefølge af begivenheder, der er skitseret ovenfor, vil udfyldning af detaljer være et stykke kage.

Tjek del 2, hvor vi skal tackle strukturen i en grundlæggende webapplikation. :)