Выполнение синхронных запросов с использованием $ .ajax

Question

мы знаем, что с $ .ajax выполняются только синхронные запросы с опцией async: false. Но я видел в руководстве по Jquery, что «синхронные запросы могут временно блокировать браузер, отключая любые действия, когда запрос активен».У меня есть несколько вопросов, таких как

Я видел несколько ответов, в которых говорилось об использовании callback () Как мне заставить jQuery выполнять синхронный, а не асинхронный Ajax-запрос? .Как я могу реализовать это в моей функции.

В приведенной ниже функции, если запрос не выполняется или ответ не возвращается Как я могу обработать это. Я имею в виду Могу ли я использовать «error:» или что-то в этом роде.Как я могу эффективно улучшить эту функцию, я имею в виду использование обратного вызова и обработки ошибок. Говорят, что (мы никогда не сможем получить ошибку и успешный обратный вызов с запросом)

function empvalidate() {
          var exists = false;             // default return value is false
          var empno = $("#empno").val();
          if (empno != '') {
            $.ajax({
              url: "emp.php",
              async: false,
              dataType: "json",
              data: {'param1': $("#param1").val(), 'empno': $("#empno").val()},
              success: function (data) {
                exists = data.status;     // set status of existence to outer variable
              }
            });
          }
          return exists;                  // return actual value
        }

Answer 1

Ваш синхронизированный запрос приведет к тому, что поток пользовательского интерфейса (и, следовательно, браузер) будет ждать, пока не вернется объект XMLHttpRequest (тип независимо от того, провалился он или нет).

jQuery выполнит ваш успешный / полный и обработчик ошибок так же, как и при использовании «обычного» асинхронного запроса. Но он будет ждать / блокировать, прежде чем это сделать.

Таким образом, наихудший сценарий в данном случае будет таким, что фактический запрос занимает огромное количество времени. Сетевые задержки в этом контексте довольно плохи, большие объемы данных ... все они полностью блокируют ваш поток пользовательского интерфейса, что, очевидно, является ужасным опытом пользователя.

Я действительно не знаю, где кто-то должен использовать синхронизированный запрос ajax в настоящее время.

Answer 2

Используйте полную функцию и создайте случай для "тайм-аута"

из jQuery Docs

полная (XMLHttpRequest, textStatus) - Функция

Функция, которая будет вызывается, когда запрос заканчивается (после успеха и ошибок обратные вызовы выполняется). Функция передается два аргумента: XMLHttpRequest объект и строка, классифицирующая статус запроса («успех», «немодифицированный», «ошибка», «тайм-аут» или "Parsererror"). Это Ajax Event.

так что код будет выглядеть примерно так на вашем AJAX:

function empvalidate() {
      var exists = false;             // default return value is false
      var empno = $("#empno").val();
      if (empno != '') {
        $.ajax({
          url: "emp.php",
          async: false,
          dataType: "json",
          data: {'param1': $("#param1").val(), 'empno': $("#empno").val()},
          success: function (data, ts) {

              if(ts == "success")
                   exists = data.status; // set status of existence to outer variable
              else if(ts == "timeout")
              {
                   $(document).trigger('customTimeoutHandler');
              }
          }
        });
      }
      return exists;                  // return actual value
    }

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

Answer 3

Вместо использования async: false вам лучше сделать что-то вроде этого:

function begin_ajax() {
    // Set your UI states here
}

function success_ajax(data) {
    // Run whatever needs to run if the request is successful.
}

function error_ajax(xhr, error_type, msg) {
    // Display error messages
}

function complete_ajax() {
    // Clean up UI
}
$.ajax({
    beforeSend: begin_ajax,
    success: success_ajax,
    error: error_ajax,
    complete: complete_ajax
    // Your parameters here
});