50

PHP では、アップロード後にファイル サイズを制限する方法がありますが、アップロード前には制限できません。フォームの投稿にMalsup jQuery Form Pluginを使用しており、画像ファイルの投稿をサポートしています。

その AJAX ストリームを通過してサーバーに到達できるバイト数を設定できる制限があるのではないかと考えていました。これにより、そのファイル サイズをチェックして、ファイルが大きすぎる場合にエラーを返すことができます。

クライアント側でこれを行うことにより、ペンタックスから 10 MB の写真を撮影し、それをアップロードしようとする初心者をブロックします。

4

9 に答える 9

48

これは、非常によく似た質問での私の回答からのコピーです: How to check file input size with jQuery?


実際にはファイルシステムにアクセスできません (たとえば、ローカル ファイルの読み取りと書き込み)。ただし、HTML5 ファイル API 仕様により、アクセスできるファイル プロパティがいくつかあり、ファイル サイズはその 1 つです。

この HTML の場合:

<input type="file" id="myFile" />

以下を試してください:

//binds to onchange event of your input field
$('#myFile').bind('change', function() {
  //this.files[0].size gets the size of your file.
  alert(this.files[0].size);
});

これは HTML5 仕様の一部であるため、最新のブラウザー (IE には v10 が必要) でのみ機能し、知っておくべきその他のファイル情報に関する詳細とリンクをここに追加しました: http://felipe.sabino.me/javascript /2012/01/30/javascipt-checking-the-file-size/


古いブラウザのサポート

null古いブラウザは以前のthis.files呼び出しの値を返すため、アクセスするthis.files[0]と例外が発生することに注意してください。使用する前にファイル API のサポートを確認する必要があります。

于 2012-02-02T02:23:07.030 に答える
8

Flash、ActiveX、またはJavaアップローダーを使用しない限り、それは不可能だと思います。

セキュリティ上の理由から、アップロード前またはアップロード中に ajax / javascript がファイル ストリームまたはファイル プロパティにアクセスすることは許可されていません。

于 2008-11-21T02:59:16.713 に答える
6

この方法で試してみたところ、IE* で結果が得られ、Mozilla 3.6.16 は古いバージョンをチェックインしませんでした。

<img id="myImage" src="" style="display:none;"><br>
<button onclick="findSize();">Image Size</button>
<input type="file" id="loadfile" />
<input type="button" value="find size" onclick="findSize()" />
<script type="text/javascript">
function findSize() {
    if ( $.browser.msie ) {
       var a = document.getElementById('loadfile').value;
           $('#myImage').attr('src',a);
           var imgbytes = document.getElementById('myImage').size;
           var imgkbytes = Math.round(parseInt(imgbytes)/1024);
           alert(imgkbytes+' KB');
    }else {
           var fileInput = $("#loadfile")[0];
           var imgbytes = fileInput.files[0].fileSize; // Size returned in bytes.
           var imgkbytes = Math.round(parseInt(imgbytes)/1024);
                   alert(imgkbytes+' KB');
     }
}    
</script>

Jquery ライブラリも追加します。

于 2011-03-26T19:22:53.653 に答える
4

Apache2 (Apache 1.5 も確認してください) には、アップロードする前にこれを .htaccess ファイルにドロップすることでこれを制限する方法があることがわかりました。

LimitRequestBody 2097152

これにより、ファイルのアップロード時に 2 メガバイト (2 * 1024 * 1024) に制限されます (バイト計算を適切に行った場合)。

これを行うと、フォーム ポストまたは取得リクエストでこの制限を超えると、Apache エラー ログに次のエントリが生成されることに注意してください。

Requested content-length of 4000107 is larger than the configured limit of 2097152

また、Web ブラウザーに次のメッセージが表示されます。

<h1>Request Entity Too Large</h1>

そのため、Malsup jQuery Form Plugin などを使用して AJAX フォーム ポストを実行している場合、このような H1 応答をトラップしてエラー結果を表示できます。

ちなみに、返されるエラー番号は 413 です。したがって、.htaccess ファイルで次のようなディレクティブを使用できます。

Redirect 413 413.html

...そして、より優雅なエラー結果を返します。

于 2008-11-21T04:27:04.680 に答える
4
 $(".jq_fileUploader").change(function () {
    var fileSize = this.files[0];
    var sizeInMb = fileSize.size/1024;
    var sizeLimit= 1024*10;
    if (sizeInMb > sizeLimit) {


    }
    else {


    }
  });
于 2014-09-09T06:05:02.750 に答える
4

同じ問題が発生しました。ActiveX または Flash (または Java) を使用する必要があります。良いことは、侵襲的である必要がないことです。アップロードするファイルのサイズを返す単純な ActiveX メソッドがあります。

Flash を使用する場合は、派手な js/css を実行してアップロード エクスペリエンスをカスタマイズすることもできます。ファイル アップロード機能にアクセスするには、Flash (1x1 の「ムービー」として) のみを使用します。

于 2008-11-21T03:31:44.120 に答える
2

他の人が言ったように、そのようなセキュリティモデルのために JavaScript だけでは不可能です。

可能であれば、以下のソリューションのいずれかをお勧めします。どちらもクライアント側の検証にフラッシュ コンポーネントを使用します。ただし、Javascript/jQuery を使用して接続されています。どちらも非常にうまく機能し、サーバー側の技術で使用できます。

http://www.uploadify.com/

http://swfupload.org/

于 2009-10-30T21:31:32.640 に答える
0

クライアント側で画像のサイズ、幅、高さを確認することはできません。このファイルをサーバーにアップロードし、PHP を使用してこのすべての情報を確認する必要があります。PHP には、次のような特別な機能があります。getimagesize()

list($width, $height, $type, $attr) = getimagesize("img/flag.jpg");
echo "<img src=\"img/flag.jpg\" $attr alt=\"getimagesize() example\" />";
于 2010-07-14T03:11:46.133 に答える