Асинхронная опция метода jQuery.ajax() устарела, что теперь?

Question

Начиная с jQuery 1.8, использование async:false в jQuery.ajax() устарела.
Но сколько веб-страниц вы видели с "загрузочным экраном", в то время как в фоновом режиме идет постоянная связь AJAX? Я, наверное, видел тысячи из них.

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

Это действительно плохо для меня. Потому что, если языковой файл отсутствует, графический интерфейс не должен отображаться. Так как мне это решить? Поместите весь мой код в success Перезвоните? Это не похоже на хорошую практику кодирования для меня. Могу ли я решить это по-другому?

Answer 1

Решение состоит в том, чтобы вручную добавить оверлей, чтобы пользователь не мог взаимодействовать с интерфейсом, а затем удалить его после выполнения запроса AJAX.

$(function() {
    show_overlay();        

    $.ajax({
        // Query to server
    }).done(function() {
        // Verify good data
        // Do stuff
        remove_overlay();
    });
});

Answer 2

Я прочитал официальную дискуссию в билете об устаревании этого параметра, и вот что я понял:

• Проблема в том, что реализация Promise s ( 1) для синхронизации AJAX дает им накладные расходы.

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

• Ближайшее решение (приземление в 1.8?) - это поддержка только обратных вызовов (но не обещаний), когда async является false,

В заключение: продолжать использовать async: false если нужно, но остерегайтесь его недостатков (блокировка ВМ). Не беспокойтесь, вам предоставят альтернативу, если эта функция будет удалена $.ajax(),

Answer 3

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

Есть много способов скрыть пользовательский интерфейс (вы могли бы просто использовать jQuery UI Dialog, для которого установлено значение Modal и не имеет кнопок выхода или закрытия), поэтому я оставлю это решение на ваше усмотрение. Но расположение кода будет примерно таким:

var someFunction = function () {

    // any pre-conditions to the logic
    // obscure the UI here

    $.ajax({
        url: 'ajax/test.html',
        success: function(data) {

            // handle the response
            // show the UI again

        },
        error: function(data) {

            // handle the response
            // show the UI again

        }
    }); 
}

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

Answer 4

Простое решение состоит в том, чтобы вызвать вашу функцию в качестве обратного вызова в случае успеха вызова ajax и передать результаты вашего вызова ajax.

Например:

      function getPetInfo(petid,callback){

  $.ajax({
    url: 'get-petinfo.php',
    type: 'GET',
    async: false,
    data: {
      cache: false,
      petid: petid
    },
    success: function(data) {
      var dataobject = JSON.parse(data);
      callback(dataobject);
    }
  });
}

Answer 5

Почему вы используете AJAX, чтобы получить этот файл? Просто включите его, используя script тег.

В любом случае вы не помещаете весь свой код в onSuccess - вместо этого вы вызываете единственную функцию, которая запускает ваш код.