上传前如何用javascript检查MIME文件类型？

Question

上传前如何用javascript检查MIME文件类型？我读过这，这个和这，这个似乎可以在客户端使用javascript检查文件MIME类型的问题。现在，我知道真正的验证仍然必须在服务器端进行。我希望执行客户端检查，以避免不必要的服务器资源浪费。为了测试是否可以在客户端执行此操作，我更改了JPEG测试文件.png并选择要上载的文件。在发送文件之前，我使用javascript控制台查询文件对象：document.getElementsByTagName('input')[0].files[0];这就是我在Chrome 28.0上得到的：文件{webkitRelativePath：“，lastModifiedDate：2012年10月16日10：00 GMT+0000(UTC)，名称：”test.png“，键入：”Image/png“，大小：500055…}它显示类型为image/png这似乎表明检查是基于文件扩展名完成的，而不是MIME类型。我尝试了Firefox22.0，它给了我同样的结果。但根据W3C规范, MIME嗅探应该执行。我说的对吗？目前没有办法用javascript检查MIME类型吗？还是我遗漏了什么？

Answer 1

如果您只想检查上传的文件是否是图像，可以尝试将其加载到<img>为任何错误回调标记一个检查。

例子：

var input = document.getElementsByTagName('input')[0];var reader = new FileReader();reader.onload = function (e) {
    imageExists(e.target.result, function(exists){
        if (exists) {

            // Do something with the image file.. 

        } else {

            // different file format

        }
    });};reader.readAsDataURL(input.files[0]);function imageExists(url, callback) {
    var img = new Image();
    img.onload = function() { callback(true); };
    img.onerror = function() { callback(false); };
    img.src = url;}