web-dev-qa-db-ja.com

DropZoneの受け入れられたファイルタイプフィルター

DropZone フォームがありますが、1つの例外を除いて完全に機能します。ファイルタイプを必要に応じて正確に制限することはできません。

acceptedFiles: "image/*"を使用すると、イメージではないすべてのフォルダーとファイルの種類が淡色表示されます。 [〜#〜] tiff [〜#〜]は含まれていますが、排他的にに減らす必要があります[ 〜#〜] jpg [〜#〜]および[〜#〜] png [〜#〜]。そこには多くの試行錯誤がありませんでした。

私が試したもの:

acceptedFiles: "image/jpg"
acceptedFiles: ".jpeg,.jpg,.png"
acceptedFiles: "image/jpg,png"

しかし、それらはすべてすべてを選択可能にします。

[〜#〜] jpg [〜#〜]および[〜#〜]の正しいフォーマットは何ですかpng [〜#〜]

15
user2459855

より多くの試行錯誤により、最終的にソリューションが判明しました。

Dropzone.options.dzone = {
acceptedFiles: "image/jpeg,image/png,image/gif"
}

どうやら私のエラーは主にjpgを使用していたため、すべてが失敗しました。上記は魅力のように機能します。

44
user2459855

コントローラからも検証する必要があると思います。

$this->validate($request, [

        'file' => 'required|mimes:jpg,jpeg,png,bmp']

    );
1
Mohamud
<Dropzone
   onDrop={this.handleFilesUpload}
   >
   {({ getRootProps, getInputProps }) => (
   <div {...getRootProps()}>
   <input
   {...getInputProps()}
   accept=".csv" /*you can use any file type */
   />
   <div className="drag-container">
      <img
         className="drag-img"
         src={Drag}
         alt="drag-img"
         />
      <p className="drag-container-para">Drop files here, or click to select files</p>
   </div>
   </div>
   )}
</Dropzone>
0
Neeraj Kr