Взаимодействие сервера, клиента и БД

Интернет - это много компьютеров подключенных друг к другу через сеть.

У каждого компьютера в интернете есть свой адрес - ip адрес, такой адрес есть у вашего компьютера телфона у сервера гугл и даже ваших часов.

Все сообщения от одного компьютера к другому посылаются на ip адрес получателя и каким то образом находят его.

Когда мы пишем адрес google.com, компьютер должен узнать ip адрес сервера гугл, для этого есть механизм DNS - его цель для определенного доменного имени вернуть его ip-адрес. Но для этого ваш компьютер должен знать ip-адрес dns сервера. Когда вы включаете модем или телефон подключается к сети 4G ваш провайдер говорит адрес своего DNS сервера.Такие DNS сервера есть у многих компаний: у Google, Cloudflare и других.

После того как браузер узнал ip-адрес сервера он устанавливает с ним TCP соединение. После установления соединения браузер отсылает по этому адресу запрос. Запрос представляет собой отсылку небольшого текста от браузера к серверу. Выглядит этот текст примерно так:

GET / HTTP/2
Host: google.com
User-Agent: Mozilla/5.0
Accept: */*

Это HTTP запрос. Протокол HTTP - это основной способ общения браузера с сервером. По этому протоколу могут слать запросы не только браузеры, но и напрмиер мобильные приложения, одно серверное приложение может общаться с другим по такому протоколу.

Строчки в начале текста запроса называются Headers(Заголовки). Каждая строчка это отдельный заголовок. Есть еще тело запроса. Например, если вы отправляете форму, то данные из этой формы будут передаваться в теле запроса.

В первой строчке обычно идет тип запроса, URL, тип протокола.

Основные виды запросов:

• GET
• POST
• PUT
• DELETE
• OPTIONS

Когда вы открываете веб страницу в браузере то он шлет GET запрос, а если отправляете форму, то POST запрос.

Други типы могут быть нужны чтобы взаимодействовать по протоколу REST API. Когда приложениям нужно общаться с друг с другом то это общение согласились проводить по определенным правилам. Программистам, которые пишут фронт и бек приложения нужно договорится в каком формате они будут отправлять данные.

Coockie

Это кусочки информации которые сервер отдает браузеру, браузер их сохраняет и потом при каждом запросе отправляет их вместе с запросом. Это нужно для того что иногда серверу нужно знать что запрос пришел от определенного браузера/определенного человека. Например если вы залогинились на сайте сервер отдает браузеру куки в котором записан id вашего пользователя и потом при каждом запросе от браузера эти куки используются для того чтобы сервер знал что это именно вы.

Http это не единственный протокол, есть еще и другие, например, WebSoket протокол - используется для того чтобы организовать двустороннее взаимодействие между сервером и браузером, т.е. сообщения могут ходить как от сервера к браузеру, так и от браузера к серверу.

Сервер

Сервер - это один или несколько компьютеров которые подключены к интернету. Физически такие компьютеры обычно расположены в специальных зданиях которые называют дата центры. На сервере обычно работает специальное приложение которое так и называется веб сервер. Самые популярные сервера: Nginx, Microsoft IIS, Apache. Веб сервер обычно решает что делать с запросом, если это статический контент например картинка то веб сервер сам может получить ее с диска и отдать браузеру. А если это запрос к странице то веб сервер передает этот запрос дальше к специальной программе. И эта программа называется серверное приложение.

Серверное приложение получает запрос, после этого оно идет в базу данных чтобы получить оттуда данные, сформировать их в каком то формате и вернуть, например в виде html-страницы. Есть и другие форматы данных. Либо выдает ошибку. После этого веб сервер получает этот ответ от серверного приложения и отдает его в браузер. После этого он может закрыть соединение либо оставить его открытым.

Как правило веб приложения пишут так чтобы в них не хранилось ничего, никакое состояние, чтобы состояние хранились в базе данных. Это сделано в основном для того чтобы приложение можно было масштабировать, запускать копию приложения на нескольких компьютерах(серверах) одновременно. А это нужно для производительности, потому что у вас может быть тысячи или миллионы запросов в минуту.

Реляционные базы данных

Самые популярные: Postgres, MySQL/MariaDB, MS SQL, Oracle.

Данные хранятся в виде таблиц и получить их от туда можно с помощью SQL запросов. Состочние приложения должно храниться в базе данных. Например если пользователь ищет гостиницу в сочи то список таких гостиниц должен храниться в базе данных. И у базы данных есть важное свойство - она быстрая, если мы хотим получить список гостиниц куда пускают с животными то база данных вернет такой список за считанные милисекунды. У базы данных для этого есть специальный механизм - индексы (Index) и у каждой гостиницы может быть поле с признаком пускают ли туда с животными или нет. И индекс это такая структура которая позволяет быстро найти все записи где в этом поле стоит определенное значение. Также базы данных умеют объединять данные из нескольких таблиц, группировать данные по каком то полю или вычислять значение по нескольким полям.

Если много пользователей пытаются получить доступ к одной и той же странице то нет смысла каждый раз генерировать ее с помощью приложения снова и снова. В этом случае поможет кеширование.

Кеширование

Кеш - промежуточный буфер с быстрым доступом к нему, содержащий информацию, которая может быть запрошена с наибольшей вероятностью.

Кеширование может быть на разном уровне, можно полностью закешировать страницу и тогда приложение вообще не будет вызываться, а страница будет браться постоянно из кеша. Многие популярные веб серверы так умеют. Например для Nginx достаточно указать директорию куда складывать кеш и все заработает само. Еще можно кешировать часть страницы тогда вы сами решаете когда пишите приложение что именно вы будуте кешировать. Кеш обычно держат в памяти либо использует какое -нибудь специальное хранилище типа redis. А базы данных сами умеют кешировать запросы к ним. Например Postgress пытается держать все индексы в памяти чтобы как можно более быстрее к ним можно было обращаться. И даже сам Центральный процессор кеширует ту память с которой он в данный момент работает.

В заголовках которые возвращает сервер есть заголовок Content-type который говорит в каком формате возвращаются данные. чаще всего данные возвращаются в следующих форматах: HTML, JSON, Yaml, XML, текст без форматирования.

После того как все данные от сервера переданы, TCP соединение может быть закрыто или оставаться открытым. И управляет этим процессом специальный заголовок: Connection: Keep-Alive. Если TCP соединение остается открытым то браузер может послать через него еще один запрос к серверу. Например чтобы получить картинки или файлы скриптов.

Форматы данных

• текстовые форматы:
  • HTML - используется для описания содержимого веб страниц
  • JSON, Yaml, XML - форматы с помощью которых можно описывать любые данные

Для того чтобы отобразить веб страницу браузеру нужно распарсить текст и понять из каких частей состоит страница, будут ли там заголовки картинки какой то текст. Может быть туда включены javascript скрипты или css стили. После этого браузер пытается составить DOM дерево. Все что показано на странице организовано в памяти в виде структуры которая называется дерево. Есть корневой элемент - <html> у него 2 наследника <head> и <body> и так далее до текста картинок заголовков и тд.

Иногда в процессе построения такого дерева на встречается ссылка на внешний ресурс, например, на картинку и обычно браузер может запросить этот внешний ресурс и сразу же продолжить построение дерева не дожидаясь ответа. Но иногда все же приходится дожидаться загрузки внешнего ресурса, например javascript файла, чтобы продолжить построение дерева и это замедляет открытие страницы. И как только DOM дерево будет построено в памяти браузер рисует то что получилось на экране. Этот процесс назфвается рендерингом. Браузер берет css стили и накладывает на DOM дерево после этого пытается понять где на экране должен находиться каждый из блоков и после этого ричсует это в окошке браузера. После того как страница отрисовалась браузер начинает делать 2 вещи: слушать события например не нажали ли вы на какую то кнопку или ссылку на экране и выполнять javascript код который он загрузил вместе со страницей и тут вступает в работу фронтенд приложение.

Фронтенд приложение - это javascript код который работает в браузере он умеет слушать события которые происходят на странице и реагировать на них. У этого кода есть доступ к API браузера. API браузера - это набор функций которые может вызывать программа на javascript'e.

Примеры Browser API:

• DOM API - с его помощью можно менять содержимое веб страницы
• Vibration API - позволяет телефону вибрировать когда вы захотите
• WebGL - позволяет программировать 3хмерную графику в браузере

Но не все браузеры могут поддерживать конкретный API.

Работа мобильных приложений похоже на работу браузера, они могут отправлять запросы на сервер и получать на них ответы и они могут использовать теже форматы данных что и браузерное приложение, html формат обычно не использует потому что нет смысла генерировать веб страницу когда можно показать нативные контролы.