Как сделать AJAX-вызов, прежде чем Blueimp Uploader начнет загрузку нескольких файлов - PullRequest
1 голос
/ 20 мая 2019

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

В идеале, загрузчик должен иметь обратный вызов multi-file-initэто позволило бы мне совершить ajax-вызов на мой сервер (где подготовка была завершена) и начать загрузку отдельных файлов только после возврата подготовительного вызова.

Есть ли способ достичь этого?

В настоящее время мой серверный (php) код, который запускается для каждого загруженного файла, проверяет, была ли подготовительная работа выполнена, и запускает функцию подготовки при необходимости.Но из-за асинхронной отправки загрузчиком нескольких файлов возникает условие состязания, и иногда функция препарирования вызывается несколько раз.

1 Ответ

0 голосов
/ 28 мая 2019

Мне удалось решить мою проблему, следуя советам от barmar и добавив кнопку для запуска загрузки.

Я нашел конкретные инструкции здесь: https://stackoverflow.com/a/38236305/671669

Теперь я включаю этот код винициализация подключаемого модуля blueimp jQuery-File-Upload:

add: function (e, data) {
    // enable the upload button
    $("#fileupload-start-button").prop('disabled', false);

    // wait for button click to process
    $("#fileupload-start-button").on('xyzUploadTrigger', function (e) {
        data.submit();
    });
},

И моя привязка к кнопке «Начать загрузку» выглядит следующим образом:

$("#fileupload-start-button").on('click', function (e) {
    $(this).prop('disabled', true)
    e.preventDefault();

    // prepare server-side for upload of resources
    axios.post('/resources/initResourceCollectionForUploader',
        {
            'params': params,
        })
        .then(function (response) {
            // hide the upload button and trigger it
            $("#fileupload-controls-container").addClass('d-none');
            $("#fileupload-start-button").trigger('xyzUploadTrigger');
        })
        .catch(function (error) {
            console.log(error);
        });
});
...