File Mime Type

Check file mime type client side

by bamboo

HTML

<form id='fileForm'>
    <input type='file' name='file' />
    <input type='submit' />
</form>

JavaScript

var fileForm = document.forms[0]
, file = fileForm.elements.file;

fileForm.onsubmit = function( event ) {
    event.preventDefault()
    console.log( file.files[0] );// wrong mime type
}

document.querySelector('form input[type=file]').addEventListener('change', function(event){
	var files = event.target.files;
	for (var i = 0; i < files.length; i++) {
		if (files[i].type.match(/image.*/)) {
			var reader = new FileReader();
			reader.onload = function (readerEvent) {
				var image = new Image();
				image.onload = function (imageEvent) {
                    console.log( /^(.*)$/m.exec(window.atob( image.src.split(',')[1] )) );
				}
				image.src = readerEvent.target.result;
			}
			reader.readAsDataURL(files[i]);
		}
	}
});