Why is no file type returned when adding an MKV file to a file input?

问题

I am attempting to grab the file/mime type of a file when it is being added to a basic HTML file input.

My basic HTML:

<form method="post" enctype="multipart/form-data">
 <div>
   <label for="file">Upload an MKV file:</label>
   <input type="file" id="file" name="file" multiple>
 </div>
</form>

My Javascript:

var control = document.getElementById("file");
control.addEventListener("change", function(event) {
    var files = control.files;
    for (var i = 0; i < files.length; i++) {
        console.log("Filename: " + files[i].name);
        console.log("Type: " + files[i].type);
    }
}, false);

Working Example

When adding a MP4 for example, the following is output to the console:

Filename: myvideo.mp4
Type: video/mp4

Although when adding a MKV file, the console outputs that the type is empty, like so:

Filename: myvideo.mkv
Type:

After further research, I found that the official mimetype of an MKV file is video/x-matroska. So I tried adding accept="video/*" to the file input. This allows all video types to be added to the input besides MKV files, which is very odd.

So why is my file input unable to detect the file type of MKV files?

回答1:

"The official mimetype of an MKV file is video/x-matroska"

This is unfortunately not true. IANA still hasn't endorsed it in its list of official MIME types.

Now, it is possible that in some browsers + OS configuration you would actually have it, because the type checking is made quite leniently by browsers, generally checking against only the extension and a map of known extensions to MIME. Some browsers don't have such list themselves, and thus will use the OS one, which your user may control.

But in my case (macOs) no browser seems to show anything else than the empty string...

Firefox actually has an open issue about it.

However, you can workaround that issue by setting explicitly the extension in your accept attribute:

<input type="file" accept="video/*,.mkv">

回答2:

Please refer following to get the supported formats:

https://www.w3schools.com/html/html_media.asp
https://www.w3schools.com/html/html5_video.asp

来源：https://stackoverflow.com/questions/56454681/why-is-no-file-type-returned-when-adding-an-mkv-file-to-a-file-input

标签

javascript

html

mkv