Проверьте размер файла перед загрузкой

Я использую этот javascript, который я получил отсюда, и он отлично работает для того, что мне нужно.

var _validFileExtensions = [".jpg", ".jpeg"]; 

function File_Validator(theForm){
    var arrInputs = theForm.getElementsByTagName("input"); 
    for (var i = 0; i < arrInputs.length; i++) { 
    var oInput = arrInputs[i]; 
    if (oInput.type == "file") { 
        var sFileName = oInput.value; 
        var blnValid = false; 
            for (var j = 0; j < _validFileExtensions.length; j++) { 
                var sCurExtension = _validFileExtensions[j]; 
                if (sFileName.substr(sFileName.length - sCurExtension.length, sCurExtension.length).toLowerCase() == sCurExtension.toLowerCase()) { 
                    blnValid = true; 
                    break; 
                    } 
                } 

                if (!blnValid) { 
                    alert("Invalid image file type!"); 
                    return false; 
                } 
        } 
    } 

return true; 
}

Теперь мне было интересно, может ли, кроме того, проверить размер файла и сбой, если файл больше 500kb → все, прежде чем нажать кнопку отправки/отправки?

ИЗМЕНИТЬ

После изучения того, что предложил PHPMyCoder, я в конечном итоге решаю, используя этот код javascript:

<script language='JavaScript'>
function checkFileSize(inputFile) {
var max =  3 * 512 * 512; // 786MB

if (inputFile.files && inputFile.files[0].size > max) {
    alert("File too large."); // Do your thing to handle the error.
    inputFile.value = null; // Clear the field.
   }
}
</script>

Это проверяет размер файла и предупреждает пользователя перед отправкой формы.

Ответы

Ответ 1

Клиентская загрузка Загрузка Отмена

В современных браузерах (FF >= 3.6, Chrome >= 19.0, Opera >= 12.0 и багги на Safari) вы можете использовать API файлов HTML5. Когда значение входного файла изменяется, этот API позволит вам проверить, соответствует ли размер файла вашим требованиям. Конечно, это, а также MAX_FILE_SIZE, можно подделать, поэтому всегда используйте проверку на стороне сервера.

<form method="post" enctype="multipart/form-data" action="upload.php">
    <input type="file" name="file" id="file" />
    <input type="submit" name="submit" value="Submit" />
</form>

<script>
document.forms[0].addEventListener('submit', function( evt ) {
    var file = document.getElementById('file').files[0];

    if(file && file.size < 10485760) { // 10 MB (this size is in bytes)
        //Submit form        
    } else {
        //Prevent default and display error
        evt.preventDefault();
    }
}, false);
</script>

Отмена загрузки на стороне сервера

На стороне сервера невозможно остановить загрузку из PHP, поскольку после того, как PHP был вызван, загрузка уже завершена. Если вы пытаетесь сохранить пропускную способность, вы можете запретить загрузку со стороны сервера с настройкой ini upload_max_filesize. Проблема с этим заключается в том, что это относится ко всем загрузкам, поэтому вам придется выбирать что-то либеральное, которое работает для всех ваших загрузок. Использование MAX_FILE_SIZE обсуждалось в других ответах. Я предлагаю прочитать руководство по нему. Знайте, что он, наряду с любой другой клиентской стороной (включая проверку javascript), может быть изменен, поэтому вы всегда должны иметь валидацию на стороне сервера (PHP).

Проверка PHP

На стороне сервера вы должны подтвердить, что файл находится в пределах ограничений по размеру (потому что все до этой точки, за исключением установки INI, может быть изменено). Вы можете использовать массив $_FILES, чтобы узнать размер загрузки. (Документы о содержимом $_FILES можно найти ниже MAX_FILE_SIZE docs)

upload.php

<?php
if(isset($_FILES['file']) {
    if($_FILES['file']['size'] > 10485760) { //10 MB (size is also in bytes)
        // File too big
    } else {
        // File within size restrictions
    }
}

Ответ 2

Я создал jQuery версию ответа PhpMyCoder:

$('form').submit(function( e ) {    
    if(!($('#file')[0].files[0].size < 10485760 && get_extension($('#file').val()) == 'jpg')) { // 10 MB (this size is in bytes)
        //Prevent default and display error
        alert("File is wrong type or over 10Mb in size!");
        e.preventDefault();
    }
});

function get_extension(filename) {
    return filename.split('.').pop().toLowerCase();
}

Ответ 3

JavaScript, работающий в браузере, обычно не имеет доступа к локальной файловой системе. Это вне песочницы. Поэтому я думаю, что ответ отрицательный.