Прервать запрос AJAX на загрузку нескольких файлов

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

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

Ниже мой код:

var AJAX = $.ajax({ 
    xhr: function() {
        var XHR = new window.XMLHttpRequest();

        XHR.upload.addEventListener('progress', function(e) {
          if (e.lengthComputable) {

            var PROGRESS = Math.round((e.loaded/e.total)*100);
            $('#PROGRESS_BAR').text(PROGRESS);

        } }, false); return XHR; },
    url        : '/php.php',
    type       : 'POST',
    data       : DATA,
    cache      : false,
    processData: false,
    contentType: false,
    beforeSend : function() { }, 
    success    : function() { } 
});

$(document).on('click', '.ABORT', function(e) {     
    AJAX.abort();
});

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

Я нашел много статей, использующих .abort() для остановки процесса, но, похоже, это работает только на стороне браузера, а не на стороне сервера.

Каким образом я могу полностью прекратить загрузку, например: как на стороне клиента, так и на стороне сервера, поскольку .abort() не позволяет мне получить желаемый результат?


javascript jquery ajax abort
person user3565264    schedule 02.01.2015    source источник

Ответы (1)


arrow_upward
8
arrow_downward

Попробуй это:

var XHR = new window.XMLHttpRequest();
var AJAX = $.ajax({ 
    xhr: function() {
        XHR.upload.addEventListener('progress', function(e) {
          if (e.lengthComputable) {

            var PROGRESS = Math.round((e.loaded/e.total)*100);
            $('#PROGRESS_BAR').text(PROGRESS);

        } }, false); return XHR; },
    url        : '/php.php',
    type       : 'POST',
    data       : DATA,
    cache      : false,
    processData: false,
    contentType: false,
    beforeSend : function() { }, 
    success    : function() { } 
});

$(document).on('click', '.ABORT', function(e){      
    XHR.abort();
});
person Amundio    schedule 02.01.2015
comment
Не могли бы вы пояснить разницу между вашим кодом и кодом @user3565264? Как вы обрабатываете процесс очистки на стороне сервера, когда пользователь отменяет загрузку? - person tonix; 22.02.2016
comment
Изменение заключалось в видимости XHR. Когда его переместили, функция была видна для функции щелчка. См.: w3schools.com/js/js_scope.asp. - person Amundio; 09.03.2016