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

Типы API по сфере использования;

  • Частный API: API для использования определенной организацией или приложением. Ограниченный доступ пользователей, не публичный.
  • Публичный API: API, которые используются публично.
  • Партнерский API: он используется между организациями или разработчиками в определенном сотрудничестве.
  • Унифицированный API: это структура, которая позволяет разработчикам использовать один API вместо нескольких API для доступа к различным ресурсам и службам.

типы API в соответствии с их архитектурой;

  • SOAP API: перемещает данные с более жесткой структурой безопасности. Поиск данных осуществляется в формате XML.
  • REST API: он основан на основных принципах веб-сервисов. Он обменивается данными по протоколу HTTP. Он представляет ресурсы с уникальными URL-адресами и позволяет выполнять операции с этими ресурсами с использованием методов HTTP (GET, POST, PUT, DELETE). Данные передаются в формате JSON.

Давайте посмотрим на использование некоторых популярных API.

  • Twitter API: используется для таких операций, как запись твитов, получение пользовательских данных и управление учетными записями.
  • API YouTube: интерфейс, обеспечивающий доступ к широкому спектру контента YouTube, позволяющий извлекать видео, каналы и статистику, выполнять поиск, вставлять контент, управлять комментариями и интегрировать контент YouTube в свои приложения или службы.
  • GitHub API: интерфейс прикладного программирования, обеспечивающий доступ и управление проектами, пользователями, репозиториями и многим другим на платформе GitHub.

Немного изучив API, теперь давайте посмотрим, как они используются.

Как это использовать?

  1. Узнайте, какие действия вы можете предпринять, изучив документацию API.
  2. Получите ключ или учетные данные для использования API.
  3. Создайте запросы, которые вы хотите, чтобы API делал.
  4. На запросы API возвращает ответы в формате JSON или XML. Затем возьмите и обработайте эти ответы, чтобы получить желаемые результаты.
  5. При использовании API может возникнуть ошибка. Посмотрите в документации, что вызывают эти ошибки.
  6. Некоторые API имеют ограничения на использование. Убедитесь, что вы не превышаете лимит использования.

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

Наконец, я хочу показать пример использования API. Для этого создадим приложение, отображающее погоду с помощью OpenWeatherMap API. В приложении я буду использовать язык программирования JavaScript.

Приложение Погода

Шаг 1: Перейдите в OpenWeatherMap. Получите ключ API из раздела в вашем профиле.

Шаг 2: Создайте файл HTML. Добавьте сюда необходимые вещи для приложения.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Weather App</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap" rel="stylesheet">
</head>
<body> 
    <h1>Weather App</h1>
    <div class="container">
        <div class="input">
            <label for="input">City name: </label>
            <input type="text" id="city">
            <button onclick="getWeather()">Get weather</button>
        </div>
        <div class="output">
            <div id="info"></div>
        </div>
    </div>
    <script src="app.js"></script>
</body>
</html>

Шаг 3: Создайте файл CSS, чтобы приложение выглядело более эстетично.

body {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-family: 'Open Sans', sans-serif;
}

h1 {
    margin-top: 0;
    font-size: 40px;
}

.container {
    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 20px;
    width: 50%;
    height: 50%;
}

input[type="text"] {
    padding: 8px 10px;
    border: 1px solid black;
    border-radius: 6px;
    font-size: 14px;
    width: 300px;
}

button {
    background-color: black;
    color: white;
    border: 1px solid black;
    border-radius: 3px;
    padding: 7px 6px;
    width: 90px;
}

button:hover {
    background-color: white;
    color: black;
}

.output {
    margin-top: 20px;
}

Шаг 4: Создайте файл JavaScript. Создайте функции, которые содержат необходимые функции в приложении. Поместите ключ API, чтобы установить соединение с API.

async function getWeather() {
    const API_KEY = 'YOUR_API_KEY'
    const city = document.querySelector("#city").value
    const API_URL = `https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${API_KEY}&units=metric`

    try {
        const response = await fetch(API_URL)
        const data = await response.json()

        const weatherInfo = document.querySelector("#info")
        weatherInfo.innerHTML = `
            <h2>${data.name}, ${data.sys.country}</h2>
            <p>Temperature: ${data.main.temp}°C</p>
            <p>Weather: ${data.weather[0].description}</p>
        `
    }catch(error) {
        console.error("Error!",error)
    }
}

Последняя версия приложения:

В этой статье я рассказал основную информацию об API. Затем я попытался показать использование API на примере. Я надеюсь, что это было полезно. Спасибо, что прочитали.

Использованная литература: