35

ここから取得したこの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>

これにより、ファイル サイズがチェックされ、フォームを送信する前にユーザーに警告されます。

4

3 に答える 3

57

クライアント側のアップロードのキャンセル

最新のブラウザ（FF> = 3.6、Chrome> = 19.0、Opera> = 12.0、Safariのバグ）では、HTML5ファイルAPIを使用できます。ファイル入力の値が変更された場合、この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

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
    }
}
于 2012-07-16T23:56:51.217 に答える
12

PhpMyCoderの回答のjQueryバージョンを作成しました：

$('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();
}
于 2014-05-22T07:26:24.483 に答える
-3

ブラウザーで実行されている JavaScript は、通常、ローカル ファイル システムにアクセスできません。それはサンドボックスの外です。だから答えはノーだと思います。

于 2012-07-16T23:46:34.513 に答える