表单文件在ReactJS中接受类型

Question

我有一个简单的表格：

<form className="form-horizontal form-border" enctype="multipart/form-data">
     <div className="form-group">
         <label className="col-sm-3 control-label">Name</label>
         <div className="col-sm-4">
             <input type="text" className="form-control" ref="patch_name" required="" placeholder="Patch name" />
         </div>
     </div>

     <div className="form-group">
         <label className="col-sm-3 control-label">Description</label>
         <div className="col-sm-4">
             <input type="text" className="form-control" ref="patch_description" required="" placeholder="Patch description" />
         </div>
     </div>

     <div className="form-group">
         <label className="col-sm-3 control-label">Patch File</label>
         <div className="col-sm-4">
             <input type="file" accept="compress/*" name="patch_file" />
         </div>
     </div>

     <div className="form-group">
         <div className="col-sm-3" />
         <div className="col-sm-1">
             <input type="submit" className="btn btn-primary btn-block" value="Create Patch" />
         </div>
     </div>
 </form>

我希望只能接受tar.gz文件上传。我唯一能得到的“类型”是image/*。

在哪里可以获得类型列表？

Answer 1

这与React没有任何关系。看一下这个答案，它描述了如何使用HTML accept属性：文件输入'accept'属性-有用吗？

.gz文件的正确MIME类型是application/gzip。没有正式的MIME类型.tar.gz（因为.tar.gz实际上不是文件格式，而是文件内TAR文件的命名约定gzip）。有时application/x-gtar会使用它，但是它是非标准的（因此x-）和YMMV。您也可以在中使用文件扩展名accept，但是支持不一，我测试过的浏览器都没有.tar.gz像我们期望的那样处理两个点。

在HTML规范有以下注意事项：

在寻找特定格式的数据时，鼓励作者同时指定任何MIME类型和相应的扩展名。

考虑到这一点，您最好的选择可能是：

<input type="file" accept="application/gzip, .gz" />