Javascript Code to Check Filetype is Valid Image

The JavaScript Code Below Checks the The File Selected by the User Is an Image File. For Added Security Make Sure Your File Select Element Enforces

The JavaScript code below checks the the file selected by the user is an image file. For added security make sure your file select element enforces this as well via the ACCEPT attribute ...

<input accept="image/gif,image/png,image/jpeg" id="idOfImageFileControl" name="inputfilephoto" type="file"> // get any file selected var selected_file = document.querySelector("#idOfImageFileControl"); if(selected_file.files.length > 0) { // check to see if filetype select is valid image file let validImg = (file && file["type"].split('/')[0] === "image"); // if the filetype is not a valid image file if(!validImg) { alert("Please only select a valid image file."); return false; } }