【问题标题】:Can't upload multiple large files in dropzone.js无法在 dropzone.js 中上传多个大文件
【发布时间】:2020-08-15 18:44:21
【问题描述】:

目前,我的代码无法上传 9 个文件,每个文件最多 32MB,并出现以下错误:

我的网络标签也显示了这个状态为 200 的请求:

以下是我使用的 dropzone 配置选项:

dropzoneOptions: {
    maxFiles: 1000,
    timeout: 100000,
    maxFilesize: 100,
    parallelUploads: 1,
    paramName: 'images',
    addRemoveLinks: true,
    uploadMultiple: true,
    autoProcessQueue: false,
    maxThumbnailFilesize: 100,
    url: `${axios.defaults.baseURL}/admin/album/pictures`,
    headers: { 'Authorization': `Bearer ${accessToken()}` },
    error: this.dropzoneSubmissionError,
    success: this.dropzoneSubmissionSuccess,
},

这里是dropzone 标签:

<vue-dropzone
    ref="myVueDropzone" id="dropzone" class="custom-dropzone"
    :options="dropzoneOptions" @vdropzone-sending="addPictures"
    @vdropzone-complete-multiple="vDropzoneCompleteMultiple"
    @vdropzone-total-upload-progress="vDropzoneTotalUploadProgress"
    @vdropzone-canceled="vDropzoneCanceled"
/>

下面是dropzone标签中提到的各种事件调用的函数:

addPictures(file, xhr, formData) {
    formData.append('album_id', this.$route.params.album_id);
},
vDropzoneCompleteMultiple(response) {
    console.log(response);
},
vDropzoneTotalUploadProgress(progress) {
    this.pictures_uploading = true;
    console.log(progress);
    this.totalUpload.width = progress;
},
vDropzoneCanceled(file) {
    console.log(file);
}

此外,由于我已经在 vDropzoneTotalUploadProgress 函数中记录了总进度,因此该进度永远不会超过 4.16

任何帮助将不胜感激......

【问题讨论】:

  • 你的 vue.js 文件有问题。需要一些输入或缺少代码代码,如果不需要,那么您可以尝试通过下载新文件来替换 vue.js 文件。
  • 问题解决了!

标签: javascript vue.js dropzone.js vue2-dropzone


【解决方案1】:

问题解决了!!其实我所做的就是这样:

dropzoneOptions: {
    maxFiles: 1000,
    timeout: 100000,
    maxFilesize: 100,
    paramName: 'images',
    addRemoveLinks: true,
    uploadMultiple: true,
    parallelUploads: 1000,
    autoProcessQueue: false,
    maxThumbnailFilesize: 100,
    url: `${axios.defaults.baseURL}/admin/album/pictures`,
    headers: { 'Authorization': `Bearer ${accessToken()}` },
    error: this.dropzoneSubmissionError,
    successmultiple: this.dropzoneMultipleSubmissionSuccess,
},

我刚刚将并行上传添加到我的 dropzoneOptions 并将其设置为 maxFiles(您可以随意设置,但请确保无论您一次添加多少文件,它们都会并行上传)

就是这样 :) 希望它可以帮助某人

【讨论】:

    猜你喜欢
    • 2017-11-14
    • 2014-11-21
    • 1970-01-01
    • 1970-01-01
    • 2021-02-05
    • 2015-09-13
    • 2019-10-01
    • 2016-12-23
    • 1970-01-01
    相关资源
    最近更新 更多