Что такое WEB-API доступным языком?

Question

Объясните пожалуйста доступным языком, что же такое этот WEB-API?

Пытался посмотреть в интернете, но ничего не понятно, также в других вопросах по этой теме на stackoverflow объяснения сложным языком. А также для чего он нужен?

Answer 1

Условно, у вас есть несколько типов веб приложений:

MVC
web API
SPA

`MVC`

Это тип сайта, где сервер генерирует html разметку и отдаёт её клиенту (программа для просмотра содержимого ответа от сервера, может быть браузер, cmd и т.д.).

Этот тип веб-приложение сам определяет страницы, всю разметку и логику отрисовки, после чего передаёт её в браузер. Браузер получает разметку и отображает её для конечного пользователя

Так же вам стоит понимать, что такие типы веб приложение возвращают (результат работы сервера) именно разметку (для простоты пока обойдёмся только этим). К примеру, когда вы переходите на главную страницу Google вы видите разметку. Так же вы можете выполнить запрос по этому же адресу из cmd и получить такой ответ:

C:\Users\User>curl https://google.com
<HTML><HEAD><meta http-equiv="content-type" content="text/html;charset=utf-8">
<TITLE>301 Moved</TITLE></HEAD><BODY>
<H1>301 Moved</H1>
The document has moved
<A HREF="https://www.google.com/">here</A>.
</BODY></HTML>

Как вы видите, вы получили html код в виде текста. Браузер умеет работать с этим, по этому он сразу превращает это в красивую страницу

`Web API`

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

Таких приложений очень много. Для примера вы можете взять CoingeckoApi и посмотреть пример работы самого api. Отсюда и возьму пример:

[
  {
    "id": "bybit_spot",
    "name": "Bybit",
    "year_established": 2018,
    "country": "British Virgin Islands",
    "description": "Bybit is a cryptocurrency exchange that offers a professional platform featuring an ultra-fast matching engine, excellent customer service and multilingual community support for crypto traders of all levels...",
    "url": "https://www.bybit.com",
    "image": "https://assets.coingecko.com/markets/images/698/small/bybit_spot.png?1706864649",
    "has_trading_incentive": false,
    "trust_score": 10,
    "trust_score_rank": 1,
    "trade_volume_24h_btc": 51075.6271283852,
    "trade_volume_24h_btc_normalized": 47765.5886637453
  },
  {
    "id": "gdax",
    "name": "Coinbase Exchange",
    "year_established": 2012,
    "country": "United States",
    "description": "",
    "url": "https://www.coinbase.com/",
    "image": "https://assets.coingecko.com/markets/images/23/small/Coinbase_Coin_Primary.png?1706864258",
    "has_trading_incentive": false,
    "trust_score": 10,
    "trust_score_rank": 2,
    "trade_volume_24h_btc": 37443.7299607648,
    "trade_volume_24h_btc_normalized": 37443.7299607648
  }
]

Выше представлен пример ответа от API сервиса в формате json. Что такое вообще json можете прочитать на Вики

Именно по структуре сервера Web Api достаточно сильно похож на mvc, просто разница в том, в каком формате сервер пытает передать данные для клиента

Основная суть web api в том, что ответы предоставляются в json формате, который является общим для большинства приложений. Это значит, что работать с api могут web приложения, desktop или мобильные приложения. Все они могут и умеют обрабатывать текстовый ответ от сервера и показывать пользователю.

Хороший пример может быть сайт банка. Если вы скачаете мобильное приложение этого же банка, они будут работать с одним веб-сервером (который api) и ваши данные будут синхронизированы между сайтом и мобильным приложением. Так же, в администраторов банка, скорее всего, есть какое-то desktop приложение, через которое проводится администрирование. Все эти приложения работают отдельно друг от друга, всё что их связывает - это общий web api сервер.

`SPA`

SPA - Single Page Application или одностраничное приложения. Обычно этим термином обозначают приложения написаны на технологиях React, Angular или Vue. Такие приложения по факту представляют огромные куски Java Script кода, который генерирует всю html разметку на клиенте (это важно для понимания работы). Самое главное, что такие приложения требуют наличия Web Api что бы получать данные из сервера.

Обычно общение с сервером происходит путём Http запроса с использованием fetch, jQuery ajax или axios. После запроса, ответ от сервера приходит в формате json или xml, с которым SPA приложению удобно работать.

Answer 2

что же такое этот WEB-API? ...доступным языком

Web API — это способ программам "разговаривать" друг с другом через интернет.

Проще говоря: твоя программа делает запрос вроде «скажи мне погоду в Москве», а другой сервер отвечает — «сейчас 18 градусов, ясно». Это и есть Web API — программный способ получить нужную информацию автоматически, без человека.

Я приведу примеры популярных Web API, для наглядности

Название API	Что делает
OpenWeatherMap API	Дает информацию о погоде в любом городе мира
Google Maps API	Позволяет показывать карты, маршруты, координаты
YouTube API	Дает доступ к видео, комментариям, каналам и статистике
Telegram Bot API	Позволяет создавать ботов, отправлять сообщения и файлы
Twitter API	Получение и отправка твитов, работа с профилями
Spotify API	Доступ к песням, альбомам, плейлистам и данным о пользователе
TheMealDB API	База данных с рецептами и блюдами со всего мира
REST Countries API	Дает информацию о странах: столица, валюта, население и т.д.
Exchange Rates API	Получение актуальных курсов валют
NASA API	Фото с космоса, информация о планетах, миссиях, спутниках

Обычно общение с Web API выглядит так:

Ты отправляешь запрос на адрес вроде: https://api.openweathermap.org/data/2.5/weather?q=Moscow&appid=...
И получаешь в ответ данные в таком виде:

json
{
  "name": "Moscow",
  "main": {
    "temp": 18.2
  },
  "weather": [
    { "description": "ясно" }
  ]
}

Такие данные программа может использовать, чтобы показать тебе погоду, маршрут, рецепт — всё что угодно.

Итак, Web API — это инструмент, который позволяет приложениям получать нужные данные через Интернет

upd:

Вообще-то под термином WEB API могут пониматься как API веб-браузера (browser API), так и сторонние API (third-party API), описание которых привел @Dev18. Первые предназначены только для использования в клиентском JavaScript на веб-странице, открытой в браузере, вторые могут использоваться любой программой, при условии реализации в ней работы с HTTP протоколом. Неплохая статья, описывающая как первые, так и вторые, а также разницу между ними, находится здесь Ivan Shatsky

Совершенно верно замечено.

На MDN объясняется, что Web API — это не только HTTP-интерфейсы, но и встроенные возможности браузера, доступные через JS

API браузера (Browser APIs) — конструкции, встроенные в браузер, построенные на основе языка JavaScript, предназначенные для облегчения разработки функциональности.

Иначе говоря, даже такой простой вызов:

alert("Привет, мир!");

тоже считается Web API, потому что:

Он доступен через JS в контексте веб-страницы.
Он является частью веб-платформы

То есть API браузера (Browser APIs) - это подмножество WebApi

Web APIs
├── Browser APIs      → встроены в браузер
└── External Web APIs → предоставляются удалёнными серверами (REST, GraphQL и т.д.)

БЛОГ НА HUSL

Что такое WEB-API доступным языком?

Ответы (2 шт):

`MVC`

`Web API`

`SPA`