Ответ
AJAX (Asynchronous JavaScript and XML) — это подход к веб-разработке, позволяющий веб-странице обмениваться данными с сервером в фоновом режиме без полной перезагрузки страницы.
Несмотря на наличие "XML" в названии, сегодня для обмена данными почти всегда используется формат JSON.
Ключевой принцип — асинхронность. Пользователь может продолжать взаимодействовать с интерфейсом, пока данные загружаются или отправляются на сервер.
Как это работает в браузере:
JavaScript на странице использует встроенные API, такие как XMLHttpRequest
(старый способ) или Fetch API
(современный стандарт), для отправки HTTP-запросов.
Пример с использованием Fetch API
:
// Асинхронный запрос данных с сервера
fetch('https://api.example.com/data')
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json(); // Парсим ответ как JSON
})
.then(data => {
// Обновляем часть страницы, используя полученные данные
document.getElementById('content').textContent = data.message;
})
.catch(error => {
console.error('Fetch error:', error);
});
Основные области применения:
- Динамическое обновление контента: подгрузка новостей, комментариев, котировок.
- Автодополнение (autocomplete): подсказки в поисковых строках.
- Отправка форм: отправка данных без перезагрузки страницы с отображением результата.
- Бесконечная прокрутка (infinite scroll): загрузка нового контента при достижении конца страницы.
- Создание одностраничных приложений (SPA): где весь интерфейс работает без перезагрузок.