大家都知道php上傳文件有限制，如果沒有修改過php.ini文件的話，默認的上傳大小限制為2M，那么該如何上傳大文件了，比如說上傳一個1G多的大文件，可以使用大文件切割上傳的方式來解決。
何為大文件切割上傳？
原理：利用HTML5的新特性，將文件內(nèi)容切割成分段的二進制信息，然后每次向服務(wù)器上傳一段，而服務(wù)器，只需要把我們每次上傳的二進制信息整合存儲到一個文件中，那么最后這個文件就是所上傳的文件。
由于php.ini默認的上傳大小為2M，如果每批都上傳2M，我測試的時候時間比較長，這里我將其限制大小該為20M,最大post數(shù)據(jù)為28M，便于測試。如果實際開發(fā)中不能修改其參數(shù)，則每批上傳的數(shù)據(jù)不能超過最大限制。
post_max_size = 28M
upload_max_filesize = 20M
我的是在nginx里面上傳所以還需要修改Nginx配置文件/etc/nginx/nginx.con
//在http{} 里面加即可
client_max_body_size 50m #客戶端最大上傳大小 50M
JavaScript中的File對象
在之前的文章中我們已經(jīng)使用到了這個Api，F(xiàn)ile對象中保存了文件的大小、名稱、類型等信息
JavaScript中的Blob對象
Blob對象是二進制對象，也是File對象的父類，Blob對象中有一個很重要的方法：slice() 方法，利用這個方法我們可以把文件內(nèi)容切割成二進制信息。slice() 方法接受三個參數(shù)，起始偏移量，結(jié)束偏移量，還有可選的 mime 類型。如果 mime 類型，沒有設(shè)置，那么新的 Blob 對象的 mime 類型和父級一樣。
上傳頁面index.php：
!DOCTYPE html>
html>
head>
meta charset="utf-8">
meta http-equiv="X-UA-Compatible" content="IE=edge">
title>大文件切割上傳/title>
link rel="stylesheet" href="">
script>
function selfile(){
const LENGTH = 1024 * 1024 * 10;//每次上傳的大小
var file = document.getElementsByName('video')[0].files[0];//文件對象
var filename=document.getElementsByName('video')[0].files[0].name;
var totalSize = file.size;//文件總大小
var start = 0;//每次上傳的開始字節(jié)
var end = start + LENGTH;//每次上傳的結(jié)尾字節(jié)
var fd = null//創(chuàng)建表單數(shù)據(jù)對象
var blob = null;//二進制對象
var xhr = null;//xhr對象
while(start totalSize){
fd = new FormData();//每一次需要重新創(chuàng)建
xhr = new XMLHttpRequest();//需要每次創(chuàng)建并設(shè)置參數(shù)
xhr.open('POST','upload.php',false);
blob = file.slice(start,end);//根據(jù)長度截取每次需要上傳的數(shù)據(jù)
fd.append('video',blob);//添加數(shù)據(jù)到fd對象中
fd.append('filename',filename); //獲取文件的名稱
xhr.send(fd);//將fd數(shù)據(jù)上傳
//重新設(shè)置開始和結(jié)尾
start = end;
end = start + LENGTH;
}
}
/script>
/head>
body>
h1>大文件切割上傳/h1>
input type="file" name="video" onchange="selfile();" />
/body>
/html>
接收數(shù)據(jù)頁面upload.php：
?php
/**
* 大文件切割上傳，把每次上傳的數(shù)據(jù)合并成一個文件
*/
$filename = './uploads/'.$_POST['filename'];//確定上傳的文件名
//第一次上傳時沒有文件，就創(chuàng)建文件，此后上傳只需要把數(shù)據(jù)追加到此文件中
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);
}
?>
測試之前，先創(chuàng)建uploads文件夾
如果是linux系統(tǒng)的話 切記給uploads給權(quán)限
sudo chmod -R 777 uoloads/ //賦予uploads文件夾 777 權(quán)限 -R 遞歸子文件
end！
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:- jQuery Ajax 上傳文件處理方式介紹(推薦)
- Jquery ajaxsubmit上傳圖片實現(xiàn)代碼
- jQuery Ajax文件上傳(php)
- php+ajax實現(xiàn)圖片文件上傳功能實例
- 一個簡單的jQuery插件ajaxfileupload.js實現(xiàn)ajax上傳文件例子
- 自己動手打造ajax圖片上傳(網(wǎng)上沒有的)
- jquery的ajaxSubmit()異步上傳圖片并保存表單數(shù)據(jù)演示代碼
- 基于ajax實現(xiàn)文件上傳并顯示進度條
- 利用ajaxfileupload插件實現(xiàn)文件上傳無刷新的具體方法
- php ajax無刷新上傳圖片實例代碼
