Mime type validation - Client side #13

Merged
niat8586 merged 7 commits from develop into main 2025-02-04 11:36:52 +01:00
2 changed files with 10 additions and 8 deletions
Showing only changes of commit efb0f72a88 - Show all commits

View File

@ -44,14 +44,16 @@ function deleteSelected() {
// Handle file upload, check file type // Handle file upload, check file type
function validateFile() { function validateFile() {
const fileInput = document.getElementById('file'); const fileInput = document.getElementById('file');
const filePath = fileInput.value; const file = fileInput.files[0];
const allowedExtensions = /(\.mp3|\.mp4|\.mpeg|\.mpga|\.m4a|\.wav|\.webm|\.ogg|\.mkv)$/i; const allowedMimeTypes = ['audio/', 'video/'];
if (!allowedExtensions.exec(filePath)) { if (file) {
alert('File type is not one of the recommended types. We recommend using MP3, MP4, MPEG, MPGA, M4A, WAV, WEBM, OGG, MKV.\n' + const fileType = file.type;
'We can not guarantee that other file types will work as expected.'); if (!allowedMimeTypes.some(type => fileType.startsWith(type))) {
fileInput.value = filePath; alert('File type is not an audio or video file.\nPlease upload an audio or video file.');
return true; fileInput.value = '';
return false;
}
} }
return true; return true;

View File

@ -35,7 +35,7 @@
<div class="mb-3"> <div class="mb-3">
<label for="file" class="form-label">Choose File</label> <label for="file" class="form-label">Choose File</label>
<input type="file" id="file" name="file" class="form-control" required <input type="file" id="file" name="file" class="form-control" required
accept=".mp3,.mp4,.mpeg,.mpga,.m4a,.wav,.webm,.ogg,.mkv" onchange="validateFile()"> accept="audio/*,video/*" onchange="validateFile()">
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label for="language" class="form-label">Select Language</label> <label for="language" class="form-label">Select Language</label>