AJAX загрузить файл с прогрес + прогресс FFMPEG - PullRequest
0 голосов
/ 24 октября 2019

Задача состоит в том, чтобы реализовать следующее: 1. На странице есть форма для загрузки файла, файл должен быть загружен асинхронно, без перезагрузки с помощью AJAX и отображения хода загрузки 2. Если файлПосле успешной загрузки отправьте команду на сервер, который должен проверить очередь, и, если очередь пуста, сообщите клиенту, что обработка файла началась, а затем запустите саму обработку. 3. Если обработка началась, то отобразитеход этой обработки

Что вам удалось реализовать? Загрузка файла была успешно осуществлена, после успешной загрузки сервер успешно выдает строку со статусом и полным путем загруженного файла

* 1004. * Загрузить фрагмент JS
$.ajax({
    url: 'api/upload/load',
    type: 'post',
    data: fd,
    contentType: false,
    processData: false,
    xhr: function() {
        var xhr = new window.XMLHttpRequest();
        xhr.upload.addEventListener("progress", function(evt) {
            if (evt.lengthComputable) {
                var percent = Math.ceil((evt.loaded / evt.total) * 100);
                console.log(percent) // Upload progress
            }
        }, false);
        return xhr;
    },
    success: function(data){
        var response = JSON.parse(data);
        if(response.status == 'success'){
            //if upload success, run command
            startConversion(response.path)
        }
    }
});

Ответ от API / загрузки / загрузки

{"status":"success","path":"<path>"}

В сценарии AJAX я делаю проверку: если response.status == 'success' , то мы вызываем функцию startConversion, которая принимает полный путьНедавно загруженный файл в качестве аргумента. Эта функция отправляет еще один AJAX-запрос на сервер, где выполняется проверка очереди.

startConversion JS Snippet

function startConversion(path){
    $.ajax({
        url: '/api/upload/conversion',
        type: 'POST',
        data: { path: path },
        success: function(data){
            var response = JSON.parse(data);
            // if response.status == 'start', run checkConversion function
        }
    })

Code / api / upload/ преобразование

$queue = $this->model->getQueue();
if($queue < 5){
    // If queue is empty, notify browser
    $output = array('progress' => 'start');
    echo json_encode($output);
    // Then start shell_ecxec
    $cmd = 'some_command';
    shell_exec('ffmpeg.exe -i ' . $path . ' ' . $cmd . ' 1>log.txt 2>&1 ');
} else {
    $output = array('progress' => 'waiting');
    echo json_encode($output);
}

Здесь по какой-то причине уже не отображается сообщение о том, что обработка началась (эхо до $ cmd) image Full ссылка

И тут начинается самое интересное. Казалось бы, что в методе к успеху можно было бы вызвать проверку состояния обработки (запуск, очередь или ошибка), и если обработка начала вызывать третью функцию, которая, снова AJAX, опрашивает, что сервер возвращаетход обработки

Но на самом деле происходит следующее: как только вторая функция отправляет запрос, в ответ ничего не возвращается, но обработка выполняется, и в консоли отображается состояниеЗапрос - ОЖИДАЕМЫЙ. Как только сервер завершает обработку, с сервера выдается ответ о том, что очередь пуста, и вы можете начать обработку хода выполнения, хотя обработка уже завершена

Существуют предложения о дальнейшем выполнении сценарияТакже блокируется командой shell_exec () до конца ее работы. Также мне не ясно, почему ответ сервера не выдается, когда в нем четко прописано эхо, и почему браузер ожидает полного завершения. работы shel_exec (), потому что после него в коде его нет. Что должно быть сделано, то есть, как если бы согласно логике вещей и коду сервер должен дать ответ в виде строки JSON, браузер должен показать, что запрос завершен со статусом 200,и сервер тем временем должен начать преобразование, но по какой-то причине этого не происходит ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...