Інтеграція API у JavaScript-Додатках
Під час роботи з API найпоширенішими HTTP-методами є GET та POST:
- GET: Використовується для отримання даних із сервера;
- POST: Використовується для надсилання даних на сервер, зазвичай під час відправлення форм або надсилання JSON-даних.
Приклад GET-запиту
GET-запит отримує дані із сервера, не змінюючи жодних ресурсів.
index.html
index.js
Функція fetchPost використовує метод fetch() для надсилання запиту до вказаного кінцевого пункту (/posts/1). Після отримання відповіді дані розбираються як JSON, і заголовок публікації витягується та відображається в HTML-параграфі.
Приклад POST-запиту
POST-запит надсилає дані на сервер, часто використовується для створення нових ресурсів або надсилання даних форми.
index.html
index.js
Функція sendPostRequest виконує запит до вказаного кінцевого пункту (/posts) з параметром method, встановленим на 'POST'. У заголовках вказано 'Content-Type': 'application/json', що означає надсилання даних у форматі JSON. У полі body містяться дані у форматі JSON з деталями нового поста, такими як title, body та userId. Після запиту відповідь сервера обробляється як JSON, і заголовок створеного поста відображається в HTML.
Надсилання заголовків і робота з різними HTTP-методами (GET, POST, PUT, DELETE)
Різні HTTP-методи мають різне призначення. Окрім GET і POST, поширеними є такі методи:
- PUT: використовується для оновлення наявного ресурсу;
- DELETE: використовується для видалення ресурсу з сервера.
Заголовки можна надсилати з будь-яким HTTP-методом для передачі додаткової інформації, наприклад, токенів автентифікації або типу вмісту.
Приклад PUT-запиту: оновлення даних
index.html
index.js
Функція updatePost надсилає запит PUT до вказаного кінцевого пункту (/posts/1) для оновлення існуючого поста. У запиті вказано method: 'PUT' для визначення дії оновлення, а також встановлено headers з 'Content-Type': 'application/json', що вказує на формат JSON. Поле body містить дані у форматі JSON, включаючи id, оновлені title, body та userId. Після отримання відповіді вона розбирається як JSON, і оновлений заголовок відображається в HTML.
Приклад запиту DELETE: видалення даних
index.html
index.js
Функція deletePost надсилає запит DELETE на вказану кінцеву точку (/posts/1) для видалення конкретного поста. Параметр method: 'DELETE' визначає дію. Після запиту статус відповіді перевіряється за допомогою response.ok: якщо запит успішний, у HTML відображається повідомлення про успішне видалення ("Post deleted successfully."). Якщо видалення не вдалося, з'являється повідомлення про помилку.
Використання параметрів запиту в API-запитах
Параметри запиту дозволяють передавати додаткову інформацію в URL, наприклад, фільтрацію даних, сортування результатів або вказання номерів сторінок у пагінованих відповідях.
GET-запит із параметрами запиту
index.html
index.js
Функція fetchPostsByUser надсилає запит до API-ендпоінту з параметром запиту (userId=1), який фільтрує пости лише для вказаного користувача. userId додається безпосередньо до URL як параметр запиту. Після отримання відфільтрованих даних функція відображає кількість постів, знайдених для цього користувача, в HTML.
1. Який HTTP-метод слід використовувати для отримання даних із сервера без зміни будь-яких ресурсів?
2. Який із наведених варіантів підтверджує успішний запит DELETE?
Дякуємо за ваш відгук!
Запитати АІ
Запитати АІ
Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат
Awesome!
Completion rate improved to 2.22Інтеграція API у JavaScript-Додатках
Свайпніть щоб показати меню
Під час роботи з API найпоширенішими HTTP-методами є GET та POST:
- GET: Використовується для отримання даних із сервера;
- POST: Використовується для надсилання даних на сервер, зазвичай під час відправлення форм або надсилання JSON-даних.
Приклад GET-запиту
GET-запит отримує дані із сервера, не змінюючи жодних ресурсів.
index.html
index.js
Функція fetchPost використовує метод fetch() для надсилання запиту до вказаного кінцевого пункту (/posts/1). Після отримання відповіді дані розбираються як JSON, і заголовок публікації витягується та відображається в HTML-параграфі.
Приклад POST-запиту
POST-запит надсилає дані на сервер, часто використовується для створення нових ресурсів або надсилання даних форми.
index.html
index.js
Функція sendPostRequest виконує запит до вказаного кінцевого пункту (/posts) з параметром method, встановленим на 'POST'. У заголовках вказано 'Content-Type': 'application/json', що означає надсилання даних у форматі JSON. У полі body містяться дані у форматі JSON з деталями нового поста, такими як title, body та userId. Після запиту відповідь сервера обробляється як JSON, і заголовок створеного поста відображається в HTML.
Надсилання заголовків і робота з різними HTTP-методами (GET, POST, PUT, DELETE)
Різні HTTP-методи мають різне призначення. Окрім GET і POST, поширеними є такі методи:
- PUT: використовується для оновлення наявного ресурсу;
- DELETE: використовується для видалення ресурсу з сервера.
Заголовки можна надсилати з будь-яким HTTP-методом для передачі додаткової інформації, наприклад, токенів автентифікації або типу вмісту.
Приклад PUT-запиту: оновлення даних
index.html
index.js
Функція updatePost надсилає запит PUT до вказаного кінцевого пункту (/posts/1) для оновлення існуючого поста. У запиті вказано method: 'PUT' для визначення дії оновлення, а також встановлено headers з 'Content-Type': 'application/json', що вказує на формат JSON. Поле body містить дані у форматі JSON, включаючи id, оновлені title, body та userId. Після отримання відповіді вона розбирається як JSON, і оновлений заголовок відображається в HTML.
Приклад запиту DELETE: видалення даних
index.html
index.js
Функція deletePost надсилає запит DELETE на вказану кінцеву точку (/posts/1) для видалення конкретного поста. Параметр method: 'DELETE' визначає дію. Після запиту статус відповіді перевіряється за допомогою response.ok: якщо запит успішний, у HTML відображається повідомлення про успішне видалення ("Post deleted successfully."). Якщо видалення не вдалося, з'являється повідомлення про помилку.
Використання параметрів запиту в API-запитах
Параметри запиту дозволяють передавати додаткову інформацію в URL, наприклад, фільтрацію даних, сортування результатів або вказання номерів сторінок у пагінованих відповідях.
GET-запит із параметрами запиту
index.html
index.js
Функція fetchPostsByUser надсилає запит до API-ендпоінту з параметром запиту (userId=1), який фільтрує пости лише для вказаного користувача. userId додається безпосередньо до URL як параметр запиту. Після отримання відфільтрованих даних функція відображає кількість постів, знайдених для цього користувача, в HTML.
1. Який HTTP-метод слід використовувати для отримання даних із сервера без зміни будь-яких ресурсів?
2. Який із наведених варіантів підтверджує успішний запит DELETE?
Дякуємо за ваш відгук!
