Web File Upload size limit

最近在项目中遇到上传文件，对上传文件的大小需要进行限制，这里学习和整理了一下一些常规的文件大小限制的方法。

1. Generally divided into two ways, one is the server-side to determine the size of the file limit, the existence of obvious defects, when the user too much, after the data uploaded to the server, monitoring it, greatly increasing the bandwidth and server pressure.

2. The other is on the front-end for size monitoring, this way to monitor early, can effectively reduce the pressure on the server.

3. When the uploaded file is too large, you can use Baidu developed file upload plugin Webuploader, or another file upload plugin plupload.

Two ways are described below:

# # #服务器端限制 # #

1. The configuration parameters on Nginx clinet_max_body_size=20m; default to 1m,

2. There is no limit to adding the default under Apache server LimitRequestBody=20m .

3. In the php.ini limit, set the following parameters individually:

   File_uploads = on; switch to allow uploading of files over HTTP. The default is on, which is open
   Upload_tmp_dir; files uploaded to the server where temporary files are stored, if not specified, will use the system default temporary folder
   Upload_max_filesize = 8m; Hope business, that is, the maximum size allowed to upload files. Default is 2M
   Post_max_size = 8m; The maximum value that can be received by the form Post to PHP, including all values in the form. Default is 8M
   Generally, after setting the above four parameters, uploading <=8m files is not a problem, in the network normal situation.

However, if you want to upload a large volume of >8m files, only set the above four items will certainly be able to pass. Unless your network really 100m/s upload high-speed, otherwise you have to care about the following parameters
Max_execution_time = 600; maximum time value per php page (seconds), default 30 seconds
Max_input_time = 600; The maximum time required for each PHP page to receive data, default 60 seconds
Memory_limit = 8m; max memory consumed per PHP page, default 8M

1. Configuration of the Web. config file in ASPhttpRuntime

httpRuntime "90" maxRequestLength="40960" useFullyQualifiedRedirectUrl="false"minFreeThreads="8" minLocalRequestFreeThreads="4" appRequestQueueLimit="100" enableVersionHeader="false"/>

HttpRuntime is to configure the ASP. NET HTTP runtime settings to determine how to handle requests to an ASP.

Executiontimeout: Represents the maximum time limit allowed to execute a request in seconds maxRequestLength: indicates that the ASPMaximum file upload size supported by. NET. This restriction can be used to prevent denial of service attacks that result from the user passing a large number of files to the server. The specified size is in kilobytes. The default value is4096 KB (4 MB). useFullyQualifiedRedirectUrl: Indicates whether client redirection is fully qualified (in .net the specified number of threads to remain free, for requests that require additional threads to complete their processing. The default value is 8. minLocalRequestFreeThreads: Represents the minimum number of free threads that Asp.net hold to allow new local requests to be executed. The number of threads is reserved for incoming requests from the local host, in case some requests make child requests to the local host during their processing. This avoids possible deadlocks caused by recursive re-entry into the WEB server. appRequestQueueLimit: Represents the maximum number of requests Asp.net will queue for the application. When there are not enough free threads to process the request, the request is queued. When the queue exceeds the limit specified in this setting, the incoming request is rejected through the "503-Server Too busy" error message. Enableversionheader: Indicates whether the specified Asp.net should output a version header. Microsoft Visual Studio 2005 use this property to determine the Asp.net version that is currently in use. For a production environment, this property is not required and can be disabled. 

Front End Limit

1. Compatible with Internet Explorer, using ActiveX, or you can use Flash for compatibility

<input type="File" style="width:500px;" onchange="Filechange (this);" >Determine if IE browser:/msie/i.test (navigator.useragent) is a simple regularvar Isie =/msie/i.test (navigator.useragent) &&!Window.opera;functionFilechange (Target) {var fileSize =0;if (Isie &&!target.files) {IE browservar filePath = Target.value;Get the absolute path to the uploaded file/** * ActiveXObject object for IE and opera compatible JS Object * Usage: * var newObj = new ActiveXObject (servername.typename[, location]) * Where Newob J is a required option. Returns the variable name of the ActiveXObject object. * ServerName is a must option. The name of the application that provided the object. * TypeName is a must option. The type or class of the object to be created. * location is optional. The name of the network server that created the object. *\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ * Scripting.FileSystemObject is an IIS built-in component for manipulating disks, folders, or text files, * The NewObj method and properties returned are much more * such as: var file = Newobj.createtextfile ("C:\test.txt", True) the second parameter indicates whether the target file will overwrite * file if it exists. Write ("Writing content"); File. Close (); */var fileSystem = new ActiveXObject ("Scripting.FileSystemObject"); The//GetFile (Path) method takes a file from the disk and returns it. var file = Filesystem.getfile (filePath); fileSize = file. Size; //File size, unit: b} else { //non ie browser fileSize = target.files[0].size;} var size = fileSize/ 1024x768/ 1024; if (size > 1) {alert ("attachment cannot be greater than 1M");}}          

1. In HTML5, not only to get the upload file size, but also to support multiple files simultaneously upload:

<InputType="File"multiple= "multiple" onchange= "Checkinfo (this ) "><script> function checkinfo (obj) {var len = obj.files.length; var text=for (var i =0; i < Len; i++) {text + =  "file:" +obj.files[i].name+ "byte \ n"; } console.log (text);} </SCRIPT>         

By adding the multiple attribute to input of file type, you can upload multiple files without increasing the limit of the number of uploaded files by increasing the number of input boxes. For a file type object, HTML5 adds a filelist interface that makes <input type="file"> it possible to access the list of files selected by the element, and it can also be used to get a list of files dragged to a Web page using the drag and drop APIs. It has an item, length, and other attributes. A more detailed introduction to the File API.

With HTML5, you can not only get the file size, but also make a local picture preview:

<InputType="File"multiple="Multiple"Onchange="Checkinfo (This)" ><DivId="Win" ></Div><Script>functionCheckinfo (obj) {var len = obj.files.length; for (var i =0; i < Len; i++) { Showimg (Obj.files[i]); }}function showimg (img) {var a = new FileReader (); A.readAsDataURL ( IMG); A.onload=function (var img = new Image (); img.src=a.result; document.getelementbyid ( ' win '). AppendChild (IMG);}} </SCRIPT>         

The Fliereader file API is used here, which allows the Web application to asynchronously load local files or content, which is used to manipulate file or Bob objects and to view the FileReader API.

Web File Upload size limit