使用Vue.js和Laravel上传进度

Question

我遵循了Maximilian https://www.youtube.com/watch?v=VqnJwh6E9ak的教程，将文件上传到S3上，我上传了大小高达250MB的不同大文件，用laravel编写的后端工作正常，并将文件上传到S3，前端也工作正常并显示Laravel返回的成功/失败消息，但是我的问题是，如果我正在上传100 mb的文件，则上传进度应同步并显示实际的上传百分比。但这不会发生，我在一秒钟内看到30％-> 60％-> 100％

以下是我的Vue.js代码

<script>

export default {
    mounted() {
        console.log('mounted');
        let url = $(location).attr('href');
        let segments = url.split('/');
        this.podcastId = segments[5];

        axios.get(`/api/podcast/${this.podcastId}`).then(response => {
            let podcast = response.data.podcast;
            this.podcast_name = podcast.name;
        });
    },
    data() {
        return {
            podcast_name: '',
            episode_title: '',
            description: '',
            short_summary: '',
            keywords: '',
            selected_file: null,
            uploadPercentage: 0,
            uploading: false,
            podcastId: ''
        }
    },
    methods: {
        toggleSection(podcast_type) {
            if (podcast_type === '2') {
                this.showHosted = false;
                this.showRss = true;
            } else if (podcast_type === '1') {
                this.showRss = false;
                this.showHosted = true;
            }
        },
        onFileChanged(event) {
            this.selected_file = event.target.files[0];
        },
        onSubmit() {
            const formData = new FormData();
            formData.append('title', this.episode_title);
            formData.append('description', this.description);
            formData.append('keywords', this.keywords);
            formData.append('summary', this.short_summary);
            formData.append('audio', this.selected_file);
            this.uploading = true;
            axios.post(`/podcaster/podcast/${this.podcastId}/add-episode`, formData, {
                onUploadProgress: uploadEvent => {
                    this.uploadPercentage = parseInt(uploadEvent.loaded * 100 / uploadEvent.total);
                    console.log(this.uploadPercentage);
                }
            }).then(response => {

                this.uploading = false;
                let status = response.data.status;
                let message = response.data.message;
                let url = response.data.url;

                swal({
                    title: "",
                    text: message,
                    type: status,
                });

                /*if (status === 'success') {
                    window.setTimeout(function () {
                        window.location.href = url;
                    }, 5000);
                }*/


            });

        }
    },
}