Как запустить функцию загрузки vue - PullRequest
0 голосов
/ 22 марта 2020

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

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

<script>
    export default {
        watch: {
            queue(n, o) {
                if (n.length > 0) {
                    this.upload();
                }
            }
        },
        data() {
            return {
                file: null,
                chunks: [],
                error: null,
                uploaded: 0
            };
        },
        computed: {
            progress() {
                if (this.file != null) {
                    return Math.floor((this.uploaded * 100) / this.file.size);
                }
                return 0;
            },
            formData() {
                let formData = new FormData;
                formData.set('is_last', this.chunks.length === 1);
                formData.set('file', this.chunks[0], `${this.file.name}.part`);
                return formData;
            },
            config() {
                return {
                    method: 'POST',
                    data: this.formData,
                    url: '/upload',
                    headers: {
                        'Content-Type': 'application/octet-stream'
                    },
                    onUploadProgress: event => {
                        this.uploaded += event.loaded;
                    }
                };
            }
        },
        methods: {
            select(event) {
                this.file = event.target.files.item(0);
                this.createChunks();
            },
            upload() {
                axios(this.config).then(response => {
                    this.chunks.shift();
                }).catch(error => {});
            },
            createChunks() {
                let size = 2048, chunks = Math.ceil(this.file.size / size);
                for (let i = 0; i < chunks; i++) {
                    this.chunks.push(this.file.slice(
                        i * size, Math.min(i * size + size, this.file.size), this.file.type
                    ));
                }
            }
        }
    }
</script>
<template>
    <div>
        <input type="file" @change="select">
        <progress :value="progress"></progress>
    </div>
</template>

проблема в том, что мой код не попадает в часть загрузки, я что-то упустил?

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