jQuery ajax-запросы работают только линейно, а не параллельно

Question

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

Проблема в том, что когда я запускаю начальный ajax-вызов, все остальные ajax-вызовы просто ждут выполнения, пока не будет сделан первоначальный вызов.

Так вот мой код:

var progress = false;
var update_progress = function() {
    if(progress) {
        $.ajax({
            url: 'index.php?do=update_progress'
        },
        function(json) {
            // Something < 100
            if(json.perc !== undefined) {
                $('#progress').css('width', json.perc + '%');
            }
            setTimeout(update_progress, 1000);
        });
    }
}
var start_import = function(i) {

    // Setting progress allowed
    progress = true;

    // start the update in 1s
    setTimeout(update_progress, 1000);

    // start the database-import (20-30 seconds runtime on server)
    $.ajax({
        url: 'index.php?do=start_import'
    },
    function(json) {

        // Import finished, disallow progressing
        progress = false;


        // Finally always complete: json.perc is 100
        if(json.perc !== undefined) {
            $('#progress').css('width', json.perc + '%');
        }
    });
};
start_import();

Это немного сбивает с толку, потому что я думал, что каждый вызов может работать сам асинхронно. Что случилось?

С уважением, Тим

Answer 1

Почему бы вам не позвонить setInterval() вместо setTimeout()? Это проблема! Следующий вызов функции update_progress() произойдет после возврата из предыдущего вызова AJAX!