在 Windows 操作系统的 React js 应用程序中上传文件时为空的 Mime 类型

Question

我在 React 应用程序中使用以下 HTML 代码来上传文件：

<div className="form-group files">
     <label>Upload Your File </label>
     <input type="file" className="form-control" multiple onChange={this.onChangeHandler} />
</div>

此代码在 lynux os 中运行良好，用于上传（doc 和 docx）文件：从 Ubuntu 机器上传 docx 文件的示例输出为：

File {
       ​ lastModified: 1585969775000
    ​    name: "Resume_2.docx"
       ​ size: 122424
       ​ **type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"**
    ​    ...
    }

但是当我尝试在 Windows 操作系统上运行相同的代码时，代码中似乎存在 BUG，因为我没有得到预期的输出。 这是windows机器上的输出

File {
       ​ lastModified: 1585968960500
    ​    name: "Resume_2.docx"
       ​ size: 122424
       ​ **type: ""**
    ​    ...
    }

type 属性是EMPTY。这与 .doc、.csv、.ppt、.pptx 等文件的输出相同。 虽然此代码适用于 .pdf、.jpg、.png、.txt 文件。

这是完成代码的Link。

Answer 1

最好是使用表单数据

var formData = new FormData();

formData.append('profileFileSrc', this.state.filesrc);

然后做一个这样的方法

handleProfileChange = (event) => {
    this.setState({
        filesrc: event.target.files[0]
    })
}

渲染下

   <input  type="file"  onChange={this.handleProfileChange} />