По вашему запросу ничего не найдено :(
Убедитесь, что запрос написан правильно, или посмотрите другие
наши статьи:
Если вас удивляет то, каким образом веб-приложения могут взаимодействовать друг с другом и передавать информацию для оптимизации операций, то вам следует познакомиться с
Webhook
, веб-перехватчиком.
Webhook (он же веб-перехватчик) – это больше, чем просто средство информационного взаимодействия для онлайн-сервисов. Webhook – это достаточно любопытная технология, используемая для запуска приложений. Эта статья позволит получить четкое понимание того, что же такое Webhook и какие методы его работы существуют.
Видео: что такое Webhook и чем отличается от API?
Что такое Webhook: быстрый экскурс
Webhook – это автоматически сгенерированный HTTP-запрос, созданный на основе каких-то данных. Он запускается предопределенным событием или действием в исходной системе и передается системе, с которой исходная система пытается установить связь.
Webhook работает быстрее, чем опрос или API. Вместе с этим для разработчиков он является менее трудоемким с точки зрения работы. Применительно к приложениям, Webhook – это не что иное, как SMS-уведомления, которые мы получаем во время использования приложения. Например, при покупке некого товара в Интернете продавец присылает вам уведомление по SMS.
Аналогично, каждый раз, когда в исходной системе происходит некоторое событие/действие, система принимающей стороны уведомляется через Webhook.
Для чего нужен Webhook?
Webhook используется для связи приложений и быстрого обмена данными между системой-источником и системой-получателем. Это приводит к двусторонней связи между двумя различными сетевыми системами.
Ниже приведен список нескольких сценариев, при который Webhook справится лучше, чем любое другое средство связи приложений:
Использование Webhook для передачи информации о событиях в различные базы данных.
Требуется мгновенный ответ приложения при выполнении определенного действия.
Использование Webhook для беспрепятственной синхронизации данных клиентов в приложении.
Необходимость иметь модель push-уведомлений для получения своевременных обновлений.
Связь должна быть взаимно-однозначной.
Webhook может помочь установить соединение между средством массовой email-рассылки/управления проводимыми акциями и платежными системами.
Разработчики требуют приравнять 2 системы к временной системе связи.
Принимая во внимание все эти утилиты, Webhook можно назвать ключевым инструментом для разработки SaaS-приложений. Одним из реально существующих примеров использования Webhook является
Shopify
, который использует веб-перехватчик, например, для операций автоматического обновления корзины или объявления о продаже.
Еще одной известной платформой является
Stripe
. Она использует Webhook для передачи сведений, связанных с обновлениями учетных записей, уведомлений об оплате и др.
Webhook vs API
Человеку, не являющемуся специалистом в данной области, может показаться, что Webhook и
API
это одно и то же, поскольку они оба используются для установки связи между приложениями. Ситуация усугубляется, когда некоторые разработчики называют Webhook
обратным API
. В данном случае только опытный разработчик сможет понять разницу между этими двумя технологиями и использовать их. Мы подготовили краткий обзор основных различий между Webhook и API.
Обе эти технологии, как принято считать, используются приложениями для передачи информации другому приложению. В общих чертах они работают одинаково. Ключевое различие заключается в процессе получения данных.
API использует процесс «опроса» для получения необходимых данных. Опрос (
polling
) – это выполнение запросов на сервер с целью проверки появления новых данных.
Webhook работает по принципу «принудительной отправки данных», то есть как только происходит инициирующее событие, из источника отправляются необходимые данные.
API ожидает появления новых данных и требует периодической активности, в то время как Webhook активируется автоматически при возникновении события.
Если говорить об их практической реализации, то они принципиально разные. Например, API связывается с продавцом, чтобы удостовериться, что нужный вам товар есть в наличии, а Webhook попросит продавца самому связаться с вами, как только нужный товар будет доступен. При таком подходе обе стороны экономят время и усилия.
Безопасность Web API – сложная задача, поскольку запросы выполняются снова и снова, и каждый раз необходимо внедрять методы обеспечения безопасности API. Обеспечить безопасность Webhook относительно просто, поскольку запросы производятся не так часто.
Webhook лучше использовать, когда требуются обновления приложения в режиме реального времени, а API – когда часто обновляется серверное приложение.
Webhook – это простейшая модель API. API – это полноценный язык приложений, способный выполнять добавление, удаление и извлечение данных. Webhook работает автоматически, в то время как API требует некоторых усилий разработчика.
Webhook не является широко поддерживаемым, в то время как большинство сторонних интеграций принимают API.
Как работает Webhook?
На первый взгляд все кажется похожим, но Webhook включает в себя определённый сложный процесс. Вот как это работает:
Шаг 1: Генерация запроса
Для использования Webhook система должна быть достаточно оборудована для поддержки всего процесса. Можно разработать дружественную к Webhook систему, осуществляя несколько HTTP-запросов для различных событий. Основанный на этом принципе Webhook имеет хорошую совместимость с платформой SaaS, поскольку присутствует поддержка нескольких событий. Также с Webhook совместимы такие платформы, как GitHub, Shopify, Twilio, Stripe и Slack.
Для начала нужно зарегистрироваться, чтобы принять Webhook'и. Регистрация должна быть проведена для более чем одного события. После регистрации на целевой URL будет автоматически сгенерирован запрос Webhook. Этот запрос обработается автоматически, когда произойдет определенное событие.
Шаг 2: Применение Webhook
Когда процесс подготовки завершен, можно использовать Webhook'и. Процесс можно упростить, если вы создадите свои Webhook и протестируете их на пригодность. Если вам покажется это слишком тяжелым, то вы можете просто добавить нужный URL-адрес веб-перехватчика в приложение и начать делиться данными.
Для использования Webhook вы можете использовать средства, указанные ниже:
1. RequestBin и Postman для тестирования Webhook
Как уже отмечалось, тестирование Webhook – это наиболее эффективный способ понять его метод работы.
RequestBin
и
Postman
– два самых популярный инструмента для тестирования.
Используя RequestBin, разработчики могут создавать нужные URL-адреса веб-перехватчиков и обмениваться данными, чтобы проверить, как он их идентифицирует. Postman аналогично может обрабатывать процесс отправки запроса для терминала и выделенный код приложения. Разработчик может свободно работать с кодировкой JSON и XML.
2. Общение приложений
Тестирование Webhook было исчерпывающим. И теперь можно приступить к делу и позволить приложениям общаться между собой. Для начала разработчикам необходимо активировать Webhook триггерных приложений.
Как правило, каждое приложение имеет большое количество настроек веб-перехватчиков. Чтобы получить данные из используемого триггерного приложения, необходимо открыть настройку Webhook в заданной форме. Будет сгенерировано поле URL и варианты для спецификации HTTP-запроса веб-перехватчика.
На следующем шаге уже необходимо использовать URL-адреса приложения, получающего данные. В этом приложении каждый документ имеет свой конкретный URL-адрес слияния. Скопируйте URL-адрес слияния или любой другой предполагаемый URL-адрес приложения. Затем снова перейдите в приложение-триггер и вставьте скопированный URL-адрес веб-перехватчика из приложения, получающего данные, в поле URL-адреса приложения-триггера. Сохраните изменения. Теперь приложение готово к работе.
Вы можете использовать любой из вышеупомянутых средств включения Webhook. Чтобы концепция работы была более понятна, ниже мы привели пример работы Webhook Shopify:
Пример Webhook
Давайте продолжим приведенный выше пример Shopify. Предположим, что новый пользователь только что разместил 2 заказа в интернет-магазине после подтверждения адреса электронной почты. Получение информации с помощью события
customer/update
будет выглядеть примерно так:
HTTP/1.1 200 OK
{
"webhook": {
"id": 744408886555322224,
"email": "ss@testmail.com",
"accepts_marketing": false,
"created_at": null,
"updated_at": null,
"first_name": "Jane",
"last_name": "Doe",
"orders_count": 2,
"state": "disabled",
"total_spent": "0.00",
"last_order_id": 54254, 54258
"note": "The user registered from India and uses store for sending gifts",
"verified_email": true,
"multipass_identifier": null,
"tax_exempt": false,
"phone": 8585858585,
"tags": "retailer",
"last_order_name": null,
"currency": "INR",
"addresses": [
],
"accepts_marketing_updated_at": null,
"marketing_opt_in_level": null,
"admin_graphql_api_id": "gid://shopify/Customer/744408886555322224" }
}
Заключение
Процесс передачи данных является ключевым во взаимодействии человека и веб-приложений. Webhook делает взаимодействие между приложениями быстрым, беспрепятственным и не таким сложным. Webhook является альтернативой API и автоматизирует коммуникационное соединение.
Допустим нам нужно отправить почтой посылку куда-то в Лондон. Что мы делаем? Идем в почту, берём специальный бланк и заполняем соответствующие поля. Отправитель Вася Пупкин, адрес: ул. Тверская, дом 40, кв. 36., Москва, Россия. Кому: Шерлок Холмс, Baker Street 221B, London, United Kingdom. То есть мы отправили посылку конкретному лицу, проживающему по конкретному адресу. Как и в реальном мире, в мире информационных технологий тоже есть своя адресация. В данном случае получателем выступает компьютер, за которым закреплён соответствующий IP адрес. IP aдрес это уникальный идентификатор устройства, подключённого к локальной сети или интернету.
p>
Видео про IP - адрес
На данный момент существуют две версии IP адресов: IP версии 4 (IPv4) и IP версии 6 (IPv6). Смысл создания новой версии заключается в том, что IP адреса в 4-ой версии уже исчерпаны. А новые устройства в сети появляются с огромной скоростью и им всем нужно выделать свой уникальный адрес.
IPv4 представляет собой 32-битное двоичное число. Удобной формой записи IP-адреса (IPv4) является запись в виде четырёх десятичных чисел (от 0 до 255), разделённых точками, например, 192.168.0.1. Но так как компьютеры понимают только двоичную систему исчисления, то указанный адрес преобразуют в двоичную форму - 11000000 10101000 00000000 00000000.
Длина же IPv6 адресов равна 128-битам. IPv6 адрес представляется в виде строки шестнадцатеричных цифр, разделенной двоеточиями на восемь групп, по 4 шестнадцатеричных цифрр в каждой. Например: 2003:00af:café:3daf:1000:edaf:1001:afad. Каждая группа равна 16 битам в двоичном представлении.
IP адреса принято делить на публичные и приватные. Публичный адрес это адрес, который виден в Интернете. Все сайты в глобальной сети имеют публичный или "белый" IP адрес. Для merionet.ru он равен 212.193.249.136. Да и ваш компьютер тоже имеет публичный адрес, который можете просмотреть либо на роутере, либо на специальных сайтах, например 2ip.ru. Но в вашем случае под одним IP адресом в Интернет могут выходить 10, 50, 100 пользователей из вашей же сети. Потому что на самом деле это адрес не конкретного компьютера в сети, а маршрутизатора, через который вы выходите в сеть. Публичные адреса должны быть уникальны в пределах всего Интернета.
Приватные же адреса это такой тип адресов, которые используют в пределах одной локальной сети и не маршрутизируются в Интернет. Существуют следующие диапазоны приватных IP адресов: 10.0.0.0-10.255.255.255, 172.16.0.0-172.31.255.255, 192.168.0.0-192.168.255.255. Посмотреть свой локальный приватный адрес можете либо в свойствах сетевого адаптера, либо в командной строке набрав команду ipconfig.
В начале зарождения Интернета IP адреса было принято делить на классы:
Класс
Начальный IP
Конечный IP
Число сетей
Число хостов
Класс A
0.0.0.0
127.255.255.255
126
16777214
Класс B
128.0.0.0
191.255.255.255
16382
65536
Класс C
192.0.0.0
223.255.255.255
2097150
254
Класс D
224.0.0.0
239.255.255.255
Класс E
240.0.0.0
254.255.255.255
При этом адрес 0.0.0.0 зарезервирован, он назначается хосту, когда он только что подключен к сети и не имеет IP адреса. Если в сети имеется DHCP сервер, то хост в качестве адреса источника отправляет адрес 0.0.0.0. Адрес 255.255.255.255 это широковещательный адрес. А адреса начинающиеся на 127 зарезервированы для так называемой loopback адресации.
Адреса класса D зарезервированы для мультикаст соединений, адреса класса E для исследований (не только крысы страдают от исследований).
IP адрес хоста имеет две части адрес сети и адрес узла. Где адрес сети, а где адрес узла - определяется маской сети. Маска сети это 32-битное число, где подряд идущие биты всегда равны 1. На самом деле каждое десятичное число IP адреса - это не что иное, как сумма степеней числа 2. Например, 192 это 1100000. Чтобы получить это значение переводим десятичное число в двоичное. Хотя это азы информатики, но подойдет любой калькулятор, даже встроенный в Windows:
А теперь посмотрим как мы получаем 192 из суммы степеней двойки:
1 * 27+1*26+0*25+0*24+0*23+0*27+0*21+0*20 = 1*27+1*26 = 128 + 64 = 192. И так каждый октет может включать в себя следующие числа:
128 64 32 16 8 4 2 1. Если в IP адресе есть место одной из указанных чисел, то в двоичном представлении на месте этого числа подставляется 1, если нет 0. В маске сети все подряд идущие биты должны быть равны 1.
Первый октет
Второй октет
Третий октет
Четвёртый октет
255
255
255
0
11111111
11111111
11111111
00000000
Принадлежность адреса классу определяется по первым битам. Для сетей класса A первый бит всегда равен 0, для класса B 10, для класса С 110.
При классовой адресации за каждым классом закреплена своя маска подсети. Для класса А это 255.0.0.0, класса B 255.255.0.0, а для класса C 255.255.255.0.
Но со временем стало ясно, что классовая адресация не оптимально использует существующие адреса. Поэтому перешли на бесклассовую адресацию, так называемую Classless Inter-Domain Routing (CIDR), где любой подсети можно задать любую маску. Отличную от стандартной. При это, маску подсети можно увеличивать, но никак не уменьшать. Наверное не раз встречали адреса типа 10.10.121.25 255.255.255.0. Этот адрес по сути является адресом класса А, но маска относится к классу C.
Но даже в случае бесклассовой адресации наблюдается перерасход IP адресов. В маленьких сетях, где всего один отдел с 40-50 компьютерами это не очень заметно. Но в больших сетях, где нужно каждому отделу выделить свой диапазон IP адресов этот вопрос стоит боком. Например, бухгалтерии вы выделили сеть с адресом 192.168.1.0/24, а там всего 25 хостов. В указанной сети же 254 адресов. Значит 229 адреса остаются не используемыми.
На самом деле здесь 256 адресов, но первый 192.168.1.0 является адресом сети, а последний 192.168.1.255 широковещательнымадресом. Итого в распоряжении администратора всего 254 адреса. Существует формула расчета количества хостов в указанной сети. Выглядит она следующим образом:
H=2n 2
Где H число хостов, n число бит отведенных под номер хоста. Например, 192.168.1.0 маска 255.255.255.0. Здесь первый 24 бит определяют номер сети, а оставшиеся 8 бит номер хоста. Исходя из этого, H=28-2 = 254.
Тут и вспоминаем про деление сетей на подсети. Кроме экономии адресного пространства, сабнеттинг дает еще и дополнительную безопасность. Трафик между сетями с разной маской не ходит, а значит пользователи одной подсети не смогут прослушать трафик пользователей в другой. Это еще и упрощает управление разрешениями в сети, так как можно назначать списки доступа и тем самым ограничивать доступ пользователей в критически важные сегменты сети.
С другой стороны, сегментирование сети позволяет увеличивать количество широковещательных доменов, уменьшая при этом сам широковещательный трафик.
В сегментировании сети используется такой подход как маска подсети с переменной длиной VLSM (Variable Length Subnet Mask). Суть состоит в том, что вам выделяют диапазон IP адресов, и вы должны распределить их так, чтобы никто не мог проснифить трафик другого и всем досталось хотя бы по одному адресу.
Выделением блоков IP адресов занимается организация IANA (Internet Assigned Numbers Authority ). Она делегирует права региональным регистраторам, которые в свою очередь выделяют блоки адресов национальным. Например, региональным регистратором для Европы является RIPE. А последние в свою очередь делят адреса, имеющиеся у них, между провайдерами.
Например, нам выделили адрес 192.168.25.0 с маской подсети 255.255.255.0.
Маску подсети можно указывать сокращенно: 192.168.25.0/24. 24 это число единиц в маске.
Нам как администраторам предприятия предстоит разделить их между четырьмя отделами, в которых по 50 хостов. Начинаем вычисления. Нам нужно 5 * 50 = 250 уникальных адресов. Но основная задача, пользователи должны быть в разных подсетях. Значит необходимо четыре подсети. Для определения количества подсетей в сети есть специальная формула:
N = 2n
Где N число подсетей, а n число бит заимствованных из хостовой части IP адреса. В нашем случае мы пока не позаимствовали ничего значить подсеть всего одна: 20 = 1. Нам же нужно четыре подсети. Простая математика нам подсказывает, что должны позаимствовать минимум 2 бита: 22 = 4. Итак, маска у нас становиться 255.255.255.192 или /26. Остальные 6 битов нам дают количество адресов равных 64 для каждой подсети, из которых доступны 62 адреса, что полностью покрывает нужду наших подсетей:
Сеть №
Число хостов
Маска подсети
Первый IP
Последний IP
Номер подсети
Широковещательный адрес
Сеть 1
50
255.255.255.192
192.168.25.1
192.168.25.62
192.168.25.0
192.168.25.63
Сеть 2
50
255.255.255.192
192.168.25.65
192.168.25.126
192.168.25.64
192.168.25.127
Сеть 3
50
255.255.255.192
192.168.25.129
192.168.25.190
192.168.25.128
192.168.25.191
Сеть 4
50
255.255.255.192
192.168.25.193
192.168.25.254
192.168.25.192
192.168.25.255
Тестировать будем в виртуальной среде Cisco Packet Tracer. Как видно из рисунка, здесь три разных хоста маски у всех одинаковые, но маршруты по умолчанию разные. По умолчанию, трафик между всеми этими подсетями идет, так как у нас в сети существует маршрутизатор, который занимается передачей трафика из одной подсети в другую. Чтобы ограничить трафик нужно прописать соответствующие списки доступа Access Lists. Но мы не будем заниматься этим сейчас, так как тема статьи совсем другая.
Чтобы определить к какой подсети относится хост, устройство выполняет операцию побитового "И" между адресом узла и маской подсети. Побитовое "И" это бинарная операция, действие которой эквивалентно применению логического "И" к каждой паре битов, которые стоят на одинаковых позициях в двоичных представлениях операндов. Другими словами, если оба соответствующих бита операндов равны 1, результирующий двоичный разряд равен 1; если же хотя бы один бит из пары равен 0, результирующий двоичный разряд равен 0.Покажем на примере:
192
168
1
125
1
1
0
0
0
0
0
0
1
0
1
0
1
0
0
0
0
0
0
0
0
0
0
1
0
1
1
1
1
1
0
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
0
0
0
0
0
0
0
0
255
255
255
0
1
1
0
0
0
0
0
0
1
0
1
0
1
0
0
0
0
0
0
0
0
0
0
1
0
0
0
0
0
0
0
0
192
168
1
0
На рисунке выше маска подсети для всех сетей одинаковая 255.255.255.192. Но давайте представим ситуацию, когда у нас подсетей так же 4, но количество хостов разное:
Сеть 1
120
Сеть 2
60
Сеть 3
25
Сеть 4
12
В принципе, можно оставить и предыдущую маску, но мы провайдер, у нас много клиентов и мы не можем позволить себе тратить IP адреса впустую. Итак, в первой сети на нужно 120 IP адресов, значит маска сети должна быть где-то в районе 120. Мы могли бы выбрать маской 120, но это невозможно, так как 120 не является степенью двойки, поэтому выбираем 128. Для второй подсети первая доступная маска 64. Но так как первые 128 адресов выделены под Сеть 1, то выбираем следующие 64 адреса, а маска будет 192, потому что именно эта маска даст нам нужное количество адресов. Третья сеть у нас состоит из 25 хостов. Ближайший возможный блок адресов это 32. А маска 224 как раз даст эти 32 адреса. В четвёртой же сети нам нужно 16 адресов. Маска будет равна 240.
Лайфхак: Чтобы быстро вычислить маску подсети из количества доступных адресов вычитываем необходимое. Например, в этой подсети 256 адресов, нам нужно 32 адреса. Производим простое вычисление: 256 32 = 224. Это число и будет в последнем октете.
Сеть №
Число хостов
Маска подсети
Первый IP
Последний IP
Номер подсети
Широковещательный адрес
Сеть 1
120
255.255.255.128
192.168.25.1
192.168.25.126
192.168.25.0
192.168.25.127
Сеть 2
60
255.255.255.192
192.168.25.129
192.168.25.190
192.168.25.128
192.168.25.191
Сеть 3
25
255.255.255.224
192.168.25.193
192.168.25.222
192.168.25.192
192.168.25.223
Сеть 4
12
255.255.255.240
192.168.25.225
192.168.25.238
192.168.25.224
192.168.25.239
А сейчас каждому интерфейсу маршрутизатора присвоен IP подсетей с масками разной длины. При этом в каждой подсети у нас остались как минимум 2 свободных адреса на случай добавления новых хостов.
На самом деле в сети уже есть готовые таблицы, где уже произведены все подсчеты и прописаны маски для разных сетей. Но умение самому вычислять не помешает, так как на экзаменах по сетевой сертификации попадаются такие задания.
Если вы начинающий веб-разработчик, возможно вы уже знаете, как работает всемирная сеть, по крайней мере, на базовом уровне.
Но когда начинаете кому-то объяснять принцип работы веб-сайта, то терпите неудачу. Что такое IP-адрес? Как работает модель «клиент-сервер» на самом деле?
В наши дни есть достаточно мощные фреймворки, которые можно использовать в своих проектах. Настолько мощные, что начинающие разработчики легко могут запутаться в принципах работы веб.
Базовый веб-поиск
Начнем с того места, где мы все были раньше: введите «www.github.com» в адресную строку браузера и просмотрите загрузку страницы.
С первого взгляда может показаться, что тут происходит какая-то магия. Но давайте заглянем глубже.
Определение частей web
Из-за обилия жаргонных слов, понимание работы интернета поначалу пугает. Но к сожалению, для дальнейшего погружения в тему, придется разобраться с ними.
Клиент: Приложение, например, Chrome или Firefox, которое запущено на компьютере и подключено к Интернету. Его основная роль состоит в том, чтобы принимать пользовательские команды и преобразовывать их в запросы к другому компьютеру, называемому веб-сервером. Хотя мы обычно используем браузер для доступа к Интернету, вы можете считать весь ваш компьютер «клиентом» модели клиент-сервер. Каждый клиентский компьютер имеет уникальный адрес, называемый IP-адресом, который другие компьютеры могут использовать для идентификации.
Сервер: Компьютер, который подключен к Интернету и также имеет IP-адрес. Сервер ожидает запросов от других машин (например, клиента) и отвечает на них. В отличие от вашего компьютера (т.е. клиента), который также имеет IP-адрес, на сервере установлено и работает специальное серверное программное обеспечение, которое подсказывает ему, как реагировать на входящие запросы от вашего браузера. Основной функцией веб-сервера является хранение, обработка и доставка веб-страниц клиентам. Существует множество типов серверов, включая веб-серверы, серверы баз данных, файловые серверы, серверы приложений и многое другое. Подробнее про сервера можно прочитать тут
IP-адрес: Internet Protocol Address. Числовой идентификатор устройства (компьютера, сервера, принтера, маршрутизатора и т.д.) в сети TCP/IP. Каждый компьютер в Интернете имеет IP-адрес, который он использует для идентификации и связи с другими компьютерами. IP-адреса имеют четыре набора чисел, разделенных десятичными точками (например, 244.155.65.2). Это называется «логический адрес». Для определения местоположения устройства в сети логический IP-адрес преобразуется в физический адрес программным обеспечением протокола TCP/IP. Этот физический адрес (т.е. MAC-адрес) встроен в оборудование. Подробнее про IP-адрес можно прочитать тут
Интернет-провайдер: Интернет-провайдер. Интернет-провайдер - посредник между клиентом и серверами. Для типичного домовладельца ИП обычно является «кабельной компанией». Когда браузер получает от вас запрос на переход к www.github.com, он не знает, где искать www.github.com. Это задание поставщика услуг Интернета - выполнить поиск DNS (системы доменных имен), чтобы спросить, на какой IP-адрес настроен сайт, который вы пытаетесь посетить.
DNS: система доменных имен. Распределенная база данных, которая хранит соответствие доменных имен компьютеров и их IP-адресов в Интернете. Не беспокойтесь о том, как сейчас работает «распределенная база данных»: просто знайте, что DNS существует, чтобы пользователи могли вводить www.github.com вместо IP-адреса. Подробнее про DNS можно прочитать тут
Имя домена: используется для идентификации одного или нескольких IP-адресов. Пользователи используют доменное имя (например, www.github.com) для доступа к веб-сайту в Интернете. При вводе имени домена в обозреватель DNS использует его для поиска соответствующего IP-адреса данного веб-сайта.
TCP/IP: Наиболее широко используется протокол связи. «Протокол» - это просто стандартный набор правил для чего-либо. TCP/IP используется в качестве стандарта для передачи данных по сетям. Подробнее про TCP/IP можно прочитать тут
Номер порта: 16-разрядное целое число, которое идентифицирует определенный порт на сервере и всегда связано с IP-адресом. Он служит способом идентификации конкретного процесса на сервере, на который могут пересылаться сетевые запросы.
Хост: Компьютер, подключенный к сети - это может быть клиент, сервер или любой другой тип устройства. Каждый хост имеет уникальный IP-адрес. Для веб-сайта, как www.google.com, хост может быть веб-сервером, который обслуживает страницы для веб-сайта. Часто между хостом и сервером происходит какая-то путаница, но заметьте, что это две разные вещи. Серверы - это тип хоста - это конкретная машина. С другой стороны, хост может ссылаться на всю организацию, которая предоставляет службу хостинга для обслуживания нескольких веб-серверов. В этом смысле можно запустить сервер с хоста.
HTTP: протокол передачи гипертекста. Протокол, используемый веб-браузерами и веб-серверами для взаимодействия друг с другом через Интернет.
URL: URL-адреса идентифицируют конкретный веб-ресурс. Простой пример https://github.com/someone. URL указывает протокол («https»), имя хоста (github.com) и имя файла (чья-то страница профиля). Пользователь может получить веб-ресурс, идентифицированный по этому URL-адресу, через HTTP от сетевого хоста, доменное имя которого github.com. Подробнее про URL можно прочитать тут
Переход от кода к веб-странице
Теперь у нас есть необходимая база, чтобы разобраться, что происходит за кулисами, когда мы вводим в строку поиска адрес Github:
1) Введите URL-адрес в браузере
2) Браузер анализирует информацию, содержащуюся в URL. Сюда входят протокол («https»), доменное имя («github.com») и ресурс («/»). В этом случае после «.com» нет ничего, что указывало бы на конкретный ресурс, поэтому браузер знает, как получить только главную (индексную) страницу.
3) Браузер связывается с поставщиком услуг Интернета, чтобы выполнить DNS-поиск IP-адреса для веб-сервера, на котором размещен веб-сервер www.github.com. Служба DNS сначала свяжется с корневым сервером имен, который просматривает https://www.github.com и отвечает IP-адресом сервера имен для домена верхнего уровня .com. Получив этот адрес служба DNS выполняет еще один запрос на сервер имен, который отвечает за домен .com и запрашивает адрес https://www.github.com.
4) Получив IP-адрес сервера назначения, Интернет-провайдер отправляет его в веб-браузер.
5) Ваш браузер берет IP-адрес и заданный номер порта из URL (протокол HTTP по умолчанию - порт 80, а HTTPS - порт 443) и открывает TCP-сокет. На этом этапе связь между веб-браузером и веб-сервер наконец-то установлена.
6) Ваш веб-браузер отправляет HTTP-запрос на веб-сервер главной HTML-страницы www.github.com.
7) Веб-сервер получает запрос и ищет эту HTML-страницу. Если страница существует, веб-сервер подготавливает ответ и отправляет его обратно в браузер. Если сервер не может найти запрошенную страницу, он отправляет сообщение об ошибке HTTP 404 (тот самый Error 404 Not Found), которое означает «Страница не найдена».
8) Ваш веб-браузер берет HTML-страницу, которую он получает, а затем анализирует ее, делая полный обзор, чтобы найти другие ресурсы, которые перечислены в ней: это адреса изображений, CSS файлов, JavaScript файлов и т.д.
9) Для каждого перечисленного ресурса браузер повторяет весь указанный выше процесс, делая дополнительные HTTP-запросы на сервер для каждого ресурса.
10) После того, как браузер закончит загрузку всех других ресурсов, перечисленных на странице HTML, страница будет загружена в окно браузера и соединение будет закрыто.
Пересечение Интернет-пропасти
Стоит отметить, как информация передается при запросе информации. Когда вы делаете запрос, эта информация разбивается на множество крошечных порций, называемых пакетами. Каждый пакет маркируется заголовком TCP, который включает в себя номера портов источника и назначения, и заголовком IP, который включает в себя IP-адреса источника и назначения. Затем пакет передается через сеть Ethernet, WiFi или сотовую сеть. Пакет может перемещаться по любому маршруту и проходить столько транзитных участков, сколько необходимо для того, чтобы добраться до конечного пункта назначения. И пакеты передаются отнюдь не в том, порядке, в котором они сформировались. Например, первый пакет может прийти третьим, а последний первым.
Нам на самом деле все равно, как пакеты туда попадут - важно только то, что они доберутся до места назначения в целости и сохранности! Как только пакеты достигают места назначения, они снова собираются и доставляются как единое целое.
Так как же все пакеты знают, как добраться до места назначения без потери? Ответ: TCP/IP.
TCP/IP - это двухкомпонентная система, функционирующая как фундаментальная «система управления» Интернета. IP означает Интернет-протокол; его задачей является отправка и маршрутизация пакетов на другие компьютеры с использованием заголовков IP (т.е. IP-адресов) каждого пакета. Вторая часть, протокол управления передачей (TCP), отвечает за разбиение сообщения или файла на меньшие пакеты, маршрутизацию пакетов к соответствующему приложению на целевом компьютере с использованием заголовков TCP, повторную отправку пакетов, если они теряются в пути, и повторную сборку пакетов в правильном порядке, как только они достигают другого конца.
Получение финальной картины
Но подождите - работа еще не закончена! Теперь, когда ваш браузер имеет ресурсы, составляющие веб-сайт (HTML, CSS, JavaScript, изображения и т.д.), он должен пройти несколько шагов, чтобы представить вам ресурсы в виде читабельной для нас с вами веб-страницы.
В браузере имеется механизм визуализации, отвечающий за отображение содержимого. Обработчик рендеринга получает содержимое ресурсов в небольших фрагментах. Затем существует алгоритм синтаксического анализа HTML, который сообщает браузеру, как анализировать ресурсы.
После анализа создается древовидная структура элементов DOM. DOM (Document Object Model) обозначает объектную модель документа и является условным обозначением для представления объектов, расположенных в HTML-документе. Этими объектами - или «узлами» - каждого документа можно управлять с помощью таких языков сценариев, как JavaScript.
После построения дерева DOM анализируются таблицы стилей, чтобы понять, как определить стиль каждого узла. Используя эту информацию, браузер проходит вниз по узлам DOM и вычисляет стиль CSS, положение, координаты и т.д. для каждого узла.
После того как в браузере появятся узлы DOM и их стили, он наконец готов соответствующим образом нарисовать страницу на экране. Результат – все, что вы когда-либо просматривали в интернете.
Итог
Интернет - это комплексная вещь, но вы только что закончили сложную часть!
О структуре веб-приложений мы расскажем в нашей следующей статье.