jQuery.opcja async metody ajax() jest przestarzała, co teraz?

Od jQuery 1.8, użycie async:false w jQuery.ajax() jest przestarzałe.
Ale ile stron internetowych widziałeś z "ekranem ładowania", gdy w tle trwa komunikacja AJAX? Prawdopodobnie widziałem ich tysiące.

Mój przypadek polega na tym, że piszę aplikację mobilną, która musi załadować plik językowy. A na początku Ładuję plik językowy i pobieram tekst przycisków i innych elementów GUI z języka plik.

To jest naprawdę złe dla mnie. Ponieważ jeśli brakuje pliku językowego, GUI nie powinien się pojawić. Jak to rozwiązać? Umieścić cały mój kod w callback success? Nie wydaje mi się to dobrą praktyką kodowania. Mogę to rozwiązać w inny sposób?
Author: Sk8erPeter, 2012-07-12

4 answers

Rozwiązanie polega na ręcznym dodaniu nakładki, aby uniemożliwić użytkownikowi interakcję z interfejsem, a następnie usunięciu go po wykonaniu zapytania AJAX.

$(function() {
    show_overlay();        

    $.ajax({
        // Query to server
    }).done(function() {
        // Verify good data
        // Do stuff
        remove_overlay();
    });
});
 38
Author: Jørgen R,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-07-12 08:46:44

Przeczytałem oficjalną dyskusję w bilecie o deprecjacji tego parametru i oto co zrozumiałem:

  • Problem polega na tym, że implementacjaobietnicy s (1) do synchronizacji AJAX daje im nad głową.

  • Istnieje mnóstwo rzeczywistych przypadków użycia sync AJAX, np. zachowanie stanu przed rozładowaniem strony. Dlatego ta funkcjonalność pozostanie, ale sposób, w jaki z niej korzystasz, może się zmienić.

  • Najbliższe rozwiązanie (lądowanie w 1.8?)ma obsługiwać tylko wywołania zwrotne (ale nie obietnice), gdy async jest false.

Podsumowując : używaj async: false, Jeśli musisz, ale uważaj na jego wady (blokowanie maszyny wirtualnej). Nie martw się, otrzymasz alternatywę, jeśli ta funkcja zostanie kiedykolwiek usunięta $.ajax().

 30
Author: Infeligo,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-05-13 23:53:39

Założę się, żeWiele z tych 1000 stron nie blokuje interfejsu użytkownika czekając na wywołanie AJAX. Zamiast tego prawdopodobnie zasłaniają interfejs użytkownika z ekranem oczekiwania w czasie wykonywania połączenia, a następnie usuwają go w module obsługi odpowiedzi.

Istnieje wiele sposobów, aby zasłonić interfejs użytkownika( możesz nawet użyć okna dialogowego jQuery UI, które jest ustawione na modalny i nie ma przycisków escape lub close), więc zostawię tę decyzję Tobie. Ale układ kodu byłby czymś tak:

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

        }
    }); 
}

Jestem pewien, że istnieje wiele sposobów osiągnięcia tej kolejności zdarzeń, ale to jest ogólna idea. Blokowanie interfejsu użytkownika nigdy nie było tak naprawdę zamierzeniem, i wyobrażam sobie, że jQuery podjęło jeszcze trudniejszą decyzję, aby włączyć tę funkcję, niż usunąć ją. Ma być asynchroniczny.

 3
Author: David,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-07-12 08:49:04

Dlaczego używasz ajax do uzyskania tego pliku? Wystarczy dołączyć go za pomocą znacznika script.

W każdym razie nie umieszczasz całego kodu w onSuccess - zamiast tego wywołujesz jedną funkcję, która rozpoczyna działanie kodu.

 -1
Author: Ariel,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-07-12 08:46:38