我尝试使用laravel-chunk-upload,但视频未上传

i try use laravel-chunk-upload but video not uploaded

提问人:ahmed gamal 提问时间:8/23/2023 最后编辑:aynberahmed gamal 更新时间:8/23/2023 访问量:92

问:

我使用laravel-chunk-upload和resuamble.js上传带有块和进度条的大型视频

所有块都显示在文件夹块中,进度条可以完美运行,但视频未上传

控制器

public function uploadLargeFiles(Request $request) {
    $receiver = new FileReceiver('file', $request, HandlerFactory::classFromRequest($request));

    if (!$receiver->isUploaded()) {
        throw new UploadMissingFileException();
    }

    $fileReceived = $receiver->receive(); // receive file
    if ($fileReceived->isFinished()) { // file uploading is complete / all chunks are uploaded
        $file = $fileReceived->getFile(); // get file
        $extension = $file->getClientOriginalExtension();
        $fileName = str_replace('.'.$extension, '', $file->getClientOriginalName()); //file name without extenstion
        $fileName .= '_' . md5(time()) . '.' . $extension; // a unique file name

        $disk = Storage::disk(config('filesystems.default'));
        $path = $disk->putFileAs('videos', $file, $fileName);

        // delete chunked file
        unlink($file->getPathname());
        return [
            'path' => asset('storage/' . $path),
            'filename' => $fileName
        ];
    }

    // otherwise return percentage informatoin
    $handler = $fileReceived->handler();
    return [
        'done' => $handler->getPercentageDone(),
        'status' => true
            ];
}

JS代码

<!-- jQuery -->
<script src="{{ asset("assets/js/jquery.js") }}" ></script>
<!-- Bootstrap JS Bundle with Popper -->
<script src="{{ asset("assets/js/bootstrap.bundle.min.js") }}" ></script>
<!-- Resumable JS -->
<script src="{{ asset("assets/js/resumable.js") }}"></script>

<script type="text/javascript">
    let browseFile = $('#browseFile');
    let resumable = new Resumable({
        target: '{{ route('files.upload.large') }}',
        query:{_token:'{{ csrf_token() }}'} ,// CSRF token
        fileType: ['mp4'],
        headers: {
            'Accept' : 'application/json'
        },
        testChunks: false,
        throttleProgressCallbacks: 1,
    });

    resumable.assignBrowse(browseFile[0]);

    resumable.on('fileAdded', function (file) { // trigger when file picked
        showProgress();
        resumable.upload() // to actually start uploading.
    });

    resumable.on('fileProgress', function (file) { // trigger when file progress update
        updateProgress(Math.floor(file.progress() * 100));
    });

    resumable.on('fileSuccess', function (file, response) { // trigger when file upload complete
        response = JSON.parse(response)
        $('#videoPreview').attr('src', response.path);
        $('.card-footer').show();
    });

    resumable.on('fileError', function (file, response) { // trigger when there is any error
        alert('file uploading error.')
    });


    let progress = $('.progress');
    function showProgress() {
        progress.find('.progress-bar').css('width', '0%');
        progress.find('.progress-bar').html('0%');
        progress.find('.progress-bar').removeClass('bg-success');
        progress.show();
    }

    function updateProgress(value) {
        progress.find('.progress-bar').css('width', `${value}%`)
        progress.find('.progress-bar').html(`${value}%`)
    }

    function hideProgress() {
        progress.hide();
    }
</script>

我尝试上传带有进度条和块的视频,但视频未上传

PHP Laravel 文件 视频 文件上传

评论

0赞 Bilal Tariq 10/5/2023
举个例子:github.com/pionl/laravel-chunk-upload-example/tree/master/...

答: 暂无答案