Determining unknown content-types with the Html5 file api
- by Jesse
I'm working through a small file upload script (learning experience) and I noticed that when selecting microsoft office related files (.doc or .docx for example) the file objects do not have a type specified:
For .doc files I had expected the type to be "application/msword" and along the same train of thought .docx to be "application/vnd.openxmlformats-officedocument.wordprocessingml.document".
In the cases when the type cannot be determined is the correct course of action to look at the file extension and match that to the "expected" content / mime type?
Sample script:
<div id="fileUpload">
<input type="file" id="fileElem" style="display:none;" onchange="handleFiles(this.files)"/>
<a href="#" id="fileSelect">Select some files</a>
</div>
<script type="text/javascript">
var fileSelect = document.getElementById("fileSelect"),
fileElem = document.getElementById("fileElem");
fileSelect.addEventListener("click", function (e) {
if (fileElem) {
fileElem.click();
}
e.preventDefault();
}, false);
function handleFiles(files) {
console.log(files);
}
</script>