web-dev-qa-db-ja.com

1つのリクエストで複数のファイルをアップロードしますDropzoneは2つのリクエストを送信します

DropZone jsを使用して、1つのリクエストで複数のファイルを送信しようとしています。

これが私のコードです：

Dropzone.autoDiscover = false;

var myDropzone = new Dropzone('#upload-Invoices', {       
    paramName: "files", 
    maxFilesize: 3.0, 
    maxFiles: 4,
    parallelUploads: 10000,
    uploadMultiple: true,
    autoProcessQueue: false
});

$('#btnUpload').on('click', function () {
    myDropzone.processQueue();
});

コントローラー：

public void FileUpload( IEnumerable<HttpPostedFileBase> file )
{
    // Do Something
}

見る：

<form action="/Index/FileUpload"
      class="dropzone"
      id="upload-Invoices" data-ajax-method="POST" data-ajax="true">
    <input type="submit" value="Upload File to Server" id="btnUpload">
</form>

別のリクエストですべてのファイルを1つのリクエストで送信したいのですが、ファイルが受信されています。Dropzoneページには機能しませんが、オプションがあります。前もって感謝します

jqueryasp.net-mvcfile-uploaddropzone.js
14
SJMan

問題は、入力type="submit"はそれ自体で別の投稿を行い、タイプをbuttonに変更すると機能しました。

9
SJMan

uploadMultipleプロパティのデフォルト値falseを使用してtrueに変更できます

$(".dropzone").dropzone({
            // autoQueue:false,
            parallelUploads:10,
            uploadMultiple:true,

https://www.dropzonejs.com/#config-uploadMultiple

5
ahmedkandil

また、一度に2つのファイルが送信されている複数のPOSTが表示されていました（たとえば、合計4つのファイルに対して2つの別々のPOST）。

私は解決策を見つけました here ：parallelUploadsを増やしています。ここで、次の方法でドロップゾーンを作成します。

var myDropzone = new Dropzone('div#dz', {
  url: 'http://httpbin.org/post',
  uploadMultiple: true,
  parallelUploads: 10
});
2
Greg Sadetsky

enqueueForUploadプロパティは廃止されました。代わりにautoProcessQueueを使用してください。私の勘は、enqueueForUploadはもう使用されておらず、autoProcessQueueをfalseに設定していないので、DropZone.jsは各ファイルを送信することを前提としています。コンポーネントにドロップされます。

_enqueueForUpload: false_を削除して_autoProcessQueue: false_を設定し、アップロードする必要のあるすべてのファイルを選択（ドロップ）した後、.processQueue()関数を呼び出します ドキュメント 。

2
Andrei V

非常に古い投稿であることがわかりますが、誰かのお役に立てれば幸いです。

2リクエスト

  1. オプション-ファイルなし
  2. POST-ファイルあり

Chromeはプリフライトリクエスト（OPTIONS）を実行してCORSヘッダーを探します。これは、ほとんどすべての最新のブラウザが従う標準です。

0
Sameer