Javascript синхронный и асинхронный запрос
Синхронный запрос: работа со станицей не возможна до завершения запроса AJAX, при этом запрос, получение ответа и его обработка производится в одной функции JavaScript Асинхронный запрос: делайте что хотите во время запроса, но когда придет ответ на AJAX запрос JavaScript должен его обработать использую CallBack функцию
Синхронный запрос - это запрос с ожиданием ответа. Т.е. скрипт создал объект, а объект послал запрос на сервер, это сразу, мгновенно не происходит. И пока этот запрос обрабатывается на сервере скрипт "висит", скрипт просто "висит", он ждет ответ с сервера. Дальше скрипт не выполняется, браузер ничего не делает, он ждет ответ с сервера. Если сервер работает долго или связь с сервером медленная, то это "зависание" может быть даже заметно на глаз. И только тогда, когда сервер все наконец-то пришлет, только тогда скрипт пойдет выполняться дальше. Т.е. скрипт в момент обмена данными с сервером он "висит".
Пример выполнения синхронного запроса: Код Javascript(jQuery)
var request = getXmlHttpRequest(); // создание объекта XmlHttpRequest request.open('GET', url, false); // готовим сам запрос request.open(метод запроса, url запроса, состояние запроса); метод запроса может быть GET или POST - это просто строка url запроса - т.е. по какому адресу произвести запрос состояние запроса - если запрос синхронный, то он в состоянии false, если асинхронный, то он в состоянии true request.send(null); // посылаем запрос методом send. Т.к. при отправке запроса методом GET содержимого нет, то в этом // методе мы указываем null. Если отправлять запрос на сервер методом POST, то в send // мы будем указывать то, что надо отправить.
Асинхронный запрос - это запрос без ожидания ответа от сервера. Т.е. скрипт создал объект, а объект послал запрос на сервер. При этом скрипт продолжает выполняться дальше и не ждет ответа от сервера. В какой-то момент данные вернуться. И тут вступает в действие событие onreadystatechenge. Сам объект меняет это событие, когда у него меняется свойство readyState. Для события создается собственная функция, в которой проверяется свойство readyState. И как только оно становится равным "4" - это значит, что данные с сервера пришли. Теперь можно полученные данные обрабатывать. При асинхронном запросе скрипт посылает данные на сервер и паралельно с этим объект возбуждает свойство onreadystatechenge и выполняет проверку свойства readyState.
Пример выполнения асинхронного запроса: Код Javascript(jQuery)
var request = getXmlHttpRequest(); // создание объекта XmlHttpRequest request.onreadystatechenge = function(){ // установка обработчика if(request.readyState == 4) ... } request.open('GET', url, true); // готовим сам запрос request.send(null); // посылаем запрос методом send
Асинхронный запрос сложнее синхронного запроса в том, что надо сначала подготовить сам запрос, а потом ловить момент, когда данные придут с сервера. Но при этом асинхронный запрос намного удобнее для пользователя и не тормозят работу браузера.