Что такое асинхронный запрос в AJAX?

В этой статье мы подробно рассмотрим асинхронные запросы AJAX. По сути, AJAX предоставляет два типа запросов, а именно синхронный AJAX и асинхронный AJAX. Асинхронные запросы в AJAX не ждут ответа от сервера, тогда как синхронные ждут ответа. Когда выполняются асинхронные запросы, JavaScript продолжает выполнять другие задачи после генерации ответа. Это позволяет любому веб-сайту обеспечивать бесперебойное обслуживание и улучшает взаимодействие с пользователем.

Предпосылки: Для этой статьи таких предпосылок нет. Достаточно базовых знаний HTML, CSS, JavaScript и AJAX. Итак, давайте посмотрим, как использовать асинхронные запросы AJAX.

Как это работает?

Всякий раз, когда отправляется запрос AJAX, он состоит из тела, а информация заголовка отправляется на сервер. Сервер интерпретирует запрос, генерирует ответ и отправляет его обратно клиенту. Хотя этот процесс занимает время, так как ответ генерируется и отправляется по сети. Таким образом, если скрипт отправляет запросы синхронно, страница не будет отвечать до тех пор, пока не будет получен ответ. Асинхронные запросы AJAX позволяют JavaScript отправлять запрос, но не ждать ответа. JavaScript может продолжать выполнять другие задачи, делая страницу отзывчивой, пока обрабатывается ответ. Асинхронные запросы можно использовать, установив параметр async в методе open.

Синтаксис:

request.open(method,url,async parameter);

Параметр async имеет значение по умолчанию «true», поэтому по умолчанию он асинхронный, но мы можем неявно ввести «true».

Пример. В этом примере мы реализовали как синхронные, так и асинхронные запросы, чтобы продемонстрировать работу обоих. Текст «ДРУГАЯ ЗАДАЧА ВЫПОЛНЕНА» отображается для отображения выполнения других задач сценария. Для реализации асинхронного запроса мы использовали приведенный ниже код, в котором для асинхронного параметра установлено значение «истина».

request.open(‘GET’,’https://jsonplaceholder.typicode.com/todos/1′,true);

в то время как в случае синхронного запроса для параметра async установлено значение false, как показано ниже.

request.open(‘GET’,’https://jsonplaceholder.typicode.com/todos/1′,false);

Мы видим, что для асинхронных задач перед ответом отображается «ДРУГАЯ ЗАДАЧА ВЫПОЛНЕНА». Таким образом, когда запрос отправляется, JavaScript немедленно выполняет следующий оператор и отображает другой оператор задачи, а после получения ответа он отображается. В то время как в случае синхронных запросов JavaScript ждал, пока ответ не будет получен и отображен после того, как он выполнил следующий оператор и отобразил другие операторы задачи.

Вывод: из приведенного ниже вывода мы видим бесперебойную работу асинхронных запросов.

Преимущества асинхронных запросов AJAX:

• Улучшает пользовательский опыт, обеспечивая бесперебойное обслуживание.
• Перезагрузка всей страницы не требуется.
• Улучшает производительность веб-приложений.