Що саме відбувається, коли ви переглядаєте веб-сайт у своєму браузері?

Що відбувається за лаштунками, коли ми вводимо www.cnn.com у веб-переглядачі та як інформація відображається на екрані?

Технічне пояснення було б дуже вдячним.

Веб-переглядач: "Добре, у мене є запит користувача на цю адресу: www.cnn.com. Я вважаю, що немає косої риски або нічого іншого, це прямий запит на головну сторінку. Також не було визначено протокол або порт, тож я припускаю, що це HTTP, і перейдемо до порту 80 ... о, добре, спочатку все. Ей, DNS, товариш, прокидайся! Де цей сайт www.cnn.com ховається? "

DNS: "Правильно ... зачекайте секунду, я запитаю провайдерів провайдерів. Гаразд, це схоже на 157.166.226.25."

Веб- переглядач: "Гаразд. Internet Protocol Suite, ваша черга! Зателефонуйте, будь ласка, 157.166.226.25. Надішліть їм цей HTTP-заголовок. Він запитує основну структуру та вміст їх головної сторінки, щоб я знав, що ще отримати ... о, добре, Я не думаю, що ви б про це піклувалися ".

TCP / IP: "Що ви маєте на увазі мою чергу ? Наче я не просто працював спиною прямо там для DNS? Боже, що потрібно, щоб трохи подякувати тут ..."

Веб-переглядач: ...

TCP / IP: "Так, так ... Підключення ... Я просто попрошу шлюз, щоб переслати його. Знаєте, це не все так просто. Мені доведеться розділити ваш гарний запит там на кілька частин тож доходить до кінця, і збирайте будь-які речі, які вони надсилають назад, з усіх тисяч пакетів, які я отримую ... ах, так, вам все одно. Цифри ".

Тим часом у штаб-квартирі CNN повідомлення нарешті опиняється у дверях Веб-сервера.

Веб-сервер CNN: "Nzhôô! Клієнт! Він хоче новин! Титульна сторінка! Як щодо цього?"

Механічний скрипт сервера CNN: "Правильно, зробимо! Титульна сторінка, так?"

Сервер баз даних CNN: "Так! Працюйте для мене! Який вміст вам потрібен?"

CNN Server Side Script Engine: "... гм, вибачте, БД, у мене є копія титульної сторінки прямо тут, у моєму кеші, нічого складати не потрібно. Але ей, візьміть цей ідентифікатор користувача і збережіть його, я надішлю його до замовника теж, тому ми знаємо, з ким ми поговоримо згодом ".

Сервер баз даних CNN: "Так!"

Знову на комп'ютері користувача ...

TCP / IP: "Ооокей, ось відповідь. О, хлопче, чому я відчуваю, що це буде великим ..."

Веб-переглядач: "Ух, ух ... у цьому є всілякий код JavaScript ... купа зображень, пара форм ... Правильно, це займе певний час, щоб візуалізувати. Краще перейдіть до цього. Ей, IP-система, Вам потрібно придбати ще багато речей. Давайте подивимось, що мені потрібно кілька таблиць стилів від i.cdn.turner.com - через HTTP і запитайте файл /cnn/.element/css/2.0/common.css. І Тоді отримайте кілька таких сценаріїв на i.cdn.turner.com, я нараховую шість до цих пір ... "

TCP / IP: "Я розумію картинку. Просто дайте мені адреси сервера і все це. І оберніть ці файли в рамках HTTP-запиту, я не хочу з цим мати справу".

DNS: "Перевірка i.cdn.turner.com ... ей, дрібниці, насправді це називається cdn.cnn.com.c.footprint.net. IP-адреса - 4.23.41.126"

Веб-переглядач: "Звичайно, впевнено ... зачекайте секунду. На обробку знадобиться кілька секунд, я намагаюся зрозуміти весь цей сценарій ..."

TCP / IP: "Гей, ось CSS, про який ви попросили. О, і ... так, ці додаткові сценарії також просто повернулися."

Веб-переглядач: "Уже є ще ... якесь відеореклама!"

TCP / IP: "О, хлопче, як це весело, як звучить ..."

Веб-переглядач: "Тут є і всілякі зображення! І цей CSS виглядає трохи неприємно ... так, тож якщо ця частина йде туди, і ця лінія знаходиться вгорі ... як на землі це б більше не підходило ... ні , Мені доведеться трохи розтягнути це, щоб це зробити ... О, але цей інший файл CSS переосмислює це правило ... Ну, це не буде простою частиною для візуалізації, це точно! "

TCP / IP: "Добре, нормально, перестаньте мене відволікати на секунду, тут ще багато чого робити".

Веб-переглядач: "Користувач, ось вам невеликий звіт про хід роботи. Вибачте, це все може зайняти кілька секунд. Завантажиться 140 різних елементів, і поки що в 16."

Через одну-дві секунди ...

TCP / IP: "Гаразд, це повинно бути все. Гей, слухайте ... вибачте, що я хапався за вас раніше, ви керуєте там? Це впевнене, здається, навантаження теж для вас".

Браузер: "Так, так, це всі ці веб-сайти в наші дні. Вони впевнені, що вам це не спроститься. Ну, я буду керувати. Це те, для чого я тут".

TCP / IP: "Я думаю, що це досить важко для всіх нас в ці дні ... О, перестаньте там грізно DNS!"

Веб- переглядач: "Ей, користувач! Веб-сайт готовий - діставай свої новини!"

Як працює веб: HTTP та CGI пояснили

Також чудове пояснення від CERN - alma mater Web: Як працює веб

• Веб-переглядач розділяє те, що ви вводите (URL-адресу), на ім'я хоста та шлях.
• Браузер формує HTTP-запит, щоб запитувати дані за вказаним ім'ям хосту та шляху.
• Браузер здійснює пошук DNS для вирішення імені хоста в IP-адресу.
• Браузер формує TCP / IP-з'єднання з комп'ютером, вказаним через IP-адресу. (Це з'єднання насправді формується з багатьох комп'ютерів, кожен передає дані наступному.)
• Браузер посилає запит HTTP вниз підключення до вказаної IP-адреси.
• Цей комп'ютер отримує запит HTTP від ​​з'єднання TCP / IP і передає його програмі веб-сервера.
• Веб-сервер зчитує ім'я хосту та шлях та знаходить або генерує дані, про які ви запитували.
• Веб-сервер генерує відповідь HTTP, що містить ці дані.
• Веб-сервер надсилає відповідь HTTP назад через TCP / IP-з'єднання на ваш апарат.
• Браузер отримує відповідь HTTP і розбиває його на заголовки (описуючи дані) та тіло (самі дані).
• Браузер інтерпретує дані, щоб вирішити, як відобразити їх у браузері - зазвичай це HTML-дані, які визначають типи інформації та їх загальну форму.
• Деякі дані будуть метаданими, які визначають додаткові ресурси, які потрібно завантажити, наприклад, таблиці стилів для детального компонування, вбудовані зображення або фільми Flash. Ці метадані знову вказуються як URL-адреса, і весь цей процес повторюється для кожного, поки всі не завантажуються.

Перший крок - пошук DNS (сервер доменних імен). Він використовує DNS-сервери, вказані у ваших мережевих налаштуваннях (або надані вам DHCP) для пошуку верхнього домену (cnn.com), а потім запитує сервер імен цього домену для IP-адреси вказаного піддомену (www.cnn.com).

Після того, як він отримає IP-адресу, ваш браузер починає зв'язок із веб-сервером. Це робиться за допомогою вказаного протоколу (який зазвичай за замовчуванням є HTTP 1.1). На сервер надсилається запит "GET" для "/", який відповідає вмісту документа HTML та відповідним заголовкам (які повідомляють браузеру про тип вмісту документа, HTML та іншу інформацію). Потім браузер аналізує документ і знаходить будь-які URL-адреси, які йому потрібно вбудувати на сторінку (наприклад, зображення або пов'язані таблиці стилів) і робить GET-запити на кожну з них.

Також браузер автоматично автоматично робить GET-запит на '/favicon.ico' (щоб відобразити маленький значок CNN поруч із заголовком сайту).

Ваш веб-переглядач також, ймовірно, вкаже в заголовках запиту, що він хоче стиснути вміст відповіді, використовуючи алгоритм gzip. Це робить завантаження файлів набагато меншим, якщо сервер його підтримує. Це все прозоро для вас, хоча це як завантаження ZIP-файлу та розпакування.

Під час перезавантаження сторінки ваш веб-переглядач перевіряє, чи ця сторінка вже кешована у вашій системі, і якщо це так, він робить HTTP-запит саме для заголовка документа та перевіряє його змінену дату. Якщо ця дата пізніше її кешованої копії, вона знову вимагає повного вмісту документа та оновить сторінку. Інакше він просто використовує вашу локальну копію.

Поки що немає інших відповідей - це те, що відбувається на стороні CNN:

• Машина в CNN отримує повідомлення від вашого комп’ютера з проханням про сторінку.
• Він перенаправляє цей запит на один із багатьох комп'ютерів, які CNN використовує для свого веб-сайту (причина цього в тому, що таким чином ви можете поширити роботу зі з’єднання веб-сторінок відповідей на багатьох комп’ютерах)
• Комп'ютер CNN отримує ваш запит, і він відповідає за допомогою веб-сторінки, яка, ймовірно, майже повністю попередньо обчислена, але, можливо, вона змінить декілька речей, перш ніж надсилати вам її (може бути оголошення вгорі, можливо, новини заголовка). Іноді комп'ютери збирають сторінку з безлічі дрібних компонентів щоразу, коли отримують запит; не впевнений, що робить CNN
• відповідь пробивається через мережу до комп'ютера, яка потім відображає її.
• відповідь не включала зображення: ваш комп'ютер потім надсилає ще один запит на зображення, і майже такий самий сценарій відбувається.

Це, очевидно, не є технічним поясненням, але може допомогти деяким милий наочний посібник (від чудового Vladstudio.com ):

Інформація, яку ви запитували, може заповнити кілька десятків книг. Але ось моя спроба пояснити це: Ваш браузер повідомляє вашій ОС знайти IP-адресу cnn.com. Тоді ваша ОС запитує у DNS-сервера IP-адресу для cnn.com. IP-адресу надсилається броузеру, який контактує з IP-адресою та запитує сторінку. Потім cnn.com надсилає вам та html-сторінку. Браузери аналізують html та передають інформацію в HTML-рендерінг. Потім браузер повідомляє ОС, що потрібно відображати на екрані.

У своєму блозі Джефф Мозер провів відмінний технічний аналіз запиту HTTPS: Перші кілька мілісекунд з'єднання HTTPS .

Є дуже прикольне відео "Sendung mit der Maus" (дуже популярне німецьке дитяче телешоу, яке пояснює технології для дітей):

Die Sendung mit der Maus - Wie funktioniert das Internet (Як працює Інтернет).

Лише німецькою мовою, на жаль, але смішно навіть без тексту. Чоловіки зі смішними шоломами грають в IP-пакети, а дані записуються на паперові картки. Класичний :-).

До речі, пояснення насправді досить хороші.