文件名扩展名与MIME类型

Question

仅使用JavaScript和像dojo / jQuery这样的框架，是否有一种方法可以找到特定文件名扩展名的内容类型？

比如说，如果我输入字符串“something.pdf”，我想显示一个提示框，上面写着“application/pdf”

或者“something.html”时显示“text/html”？

- khan

Answer 1

你可以使用node-mime。

<script src="https://wzrd.in/standalone/mime@latest"></script>
<script>
    mime.getType("something.pdf"); // etc.
<script>

- Ahmed elshiekh

Answer 2

我认为你需要自己维护映射关系（你可以通过XHR获取物理文件，但我不认为你想这样做）...

(function() {

    var extToMimes = {
       'img': 'image/jpeg',
       'png': 'image/png',
       ...
    }

    window.getMimeByExt = function(ext) {
        if (extToMimes.hasOwnProperty(ext)) {
           return extToMimes[ext];
        }
        return false;
    }

})();

jsFiddle。

如果你的映射中不存在，它会返回false。如果你愿意，你可以直接返回extToMimes[ext]，如果不存在，它将返回undefined。它还不会意外获取原型链上的东西。

如果它是一个文件input，也有访问它的选项。

var mime = $('input[type="file"]').prop('files')[0].file;

请注意，扩展名和MIME类型之间的对应关系并不能保证文件本身的实际类型；您需要在服务器端解析它以确定它是什么类型的文件。

- alex

---

只是想知道这个答案是否仍然正确，因为它已经四年了？我们是否仍需要自己维护映射？ - Marklar

@Marklar 如果您没有要上传的文件，而只是一个扩展名，我认为您需要进行映射。不过，似乎有人正在维护一个这里。 - alex

如果您有要上传的文件怎么办？您会使用XHR吗？ - Marklar

@Marklar 如果用户选择了文件，你可以使用JavaScript获取mime类型，就像答案中所演示的那样。 - alex

Answer 3

https://wzrd.in/standalone/mime@latest 目前无法使用，因此必须使用以下内容：

<script>
   import mime  from 'https://cdn.skypack.dev/mime';
   console.log(  mime.getType("file.jpg"));
</script>

- Georg Mavridis