在上传之前使用 FileReader javascript 检查图像 mime 类型答案

【问题标题】：Check an image mime type with FileReader javascript before uploading that在上传之前使用 FileReader javascript 检查图像 mime 类型
【发布时间】：2017-02-02 09:57:55
【问题描述】：

我想知道是否可以在上传文件之前检查文件 mime 类型？上传该文件后，我已经知道如何在服务器端执行此操作，但是在上传文件之前如何在客户端执行此操作？

索引代码：

<form action="/" method="post" enctype="multipart/form-data" id="form">
  <input id="image" type="file" />
  <input type="submit" value="Submit" id="submit" />
</form>

我想要的是：用户上传图像后，请在客户端检查其 MIME 类型。它应该是 jpg、jpeg 或 png。

注意：我不想检查它的扩展名，这真的很容易。我想检查它的 mime 类型。例如，如果一个人将 txt.txt 重命名为 txt.png，应该会报错。

提前致谢。

如果你能帮我解决这个问题，那就更好了：我想在客户端检查 mime 类型的原因是我想在选择后立即预览该图像，如果用户选择非图像文件，它将预览一个丑陋的照片图标。我想阻止这种情况。例如，如果一个人选择了一个非图像文件，只需向他们显示您选择的文件不是图像。所以如果你能告诉我如何检查图像是否可以显示。

【问题讨论】：

MIME 类型，如文件扩展名，只是一个标签。浏览器通常从文件扩展名推断它。如果您想测试图像是否是图像，那么您需要检查原始数据（即使这样，用户也可以始终覆盖 JavaScript，因为它在他们的浏览器中运行）。

标签： javascript mime-types

【解决方案1】：

试试这个。

document.getElementById('fileChooserID').files[0].type

【讨论】：

根据文件类型进行检查。如果我将 file.exe 重命名为 file.png，它将无法正常工作。