Html + ajax uploads large files,

Html + ajax uploads large files,

Everyone knows that php has restrictions on file uploading. If php has not been modified. if the size of an INI file is limited to 2 MB by default, how to upload a large file is required. For example, to upload a large file larger than 1 GB, you can use the large file cutting upload method.

What is big file cutting and uploading?

Principle: using the new HTML5 features, the file content is cut into the binary information of the component segment, and each time a segment is uploaded to the server, the server, you only need to store the binary information that we upload each time in one file. Then, this file is the uploaded file.

Because php. the default upload size of ini is 2 M. If each batch is uploaded 2 M, it takes a long time for me to test. Here I set the size to 20 M, the maximum size of post data is 28 MB for testing. If the parameters cannot be modified in actual development, the data uploaded in each batch cannot exceed the maximum limit.

post_max_size = 28M upload_max_filesize = 20M 

I upload files in nginx, so I also need to modify the Nginx configuration file/etc/nginx. con.

// Add client_max_body_size 50 m in http {} # maximum client upload size 50 M

File object in JavaScript

We have used this Api in previous articles. The File object stores the File size, name, type, and other information.

Blob objects in JavaScript

Blob objects are binary objects and are also the parent class of File objects. Blob objects have an important method: slice (). Using this method, we can cut the File content into binary information. The slice () method accepts three parameters: Start offset, end offset, and optional mime type. If the mime type is not set, the mime type of the new Blob Object is the same as that of the parent class.

Upload page index. php:

<! DOCTYPE html> 
Receiving data page upload. php:

<? Php/*** large file cut upload, merge the data uploaded each time into a file */$ filename = '. /uploads /'. $ _ POST ['filename']; // determine the file name to be uploaded // create the file if no file exists during the first upload, after uploading, you only need to append the data to this file if (! File_exists ($ filename) {move_uploaded_file ($ _ FILES ['video'] ['tmp _ name'], $ filename);} else {file_put_contents ($ filename, file_get_contents ($ _ FILES ['video'] ['tmp _ name']), FILE_APPEND) ;}?>
Create an uploads folder before testing.

For a linux system, grant uploads permissions.

Sudo chmod-R 777 uoloads // grant the uploads folder 777 permission-R recursive subfile
End!
The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.