简介PHP在上传超大的文件时,不能只让后端php上传,会容易上传到一半内测益处失效。需要前端要和后端相互配合一起来处理,文件上传要使用AJAX的方法,而不是form的submit的方式。前端把file文件对象按一定的大小分割成一定大小的文件(如按2M或5M来分割),对分割后的文件,一个个的上传到后端去,后端接收到分片文件后,把它们先放到一个临时的目录下,在收到前端完成的数据请求的时候,把临时目录中的文
PHP在上传超大的文件时,不能只让后端php上传,会容易上传到一半内测益处失效。需要前端要和后端相互配合一起来处理,文件上传要使用AJAX的方法,而不是form的submit的方式。
前端把file文件对象按一定的大小分割成一定大小的文件(如按2M或5M来分割),对分割后的文件,一个个的上传到后端去,后端接收到分片文件后,把它们先放到一个临时的目录下,在收到前端完成的数据请求的时候,把临时目录中的文件组装起来成一个新的文件,保存后,把临时目录下的文件删除掉就可以了。
示例代码
HTML代码:
<divclass="a">上传<inputid="myfile"type="file"name="myfile"/></div>
这里要说明一下,没有使用 submit 上传,使用 ajax上传。
JS代码:
< >$(function(){letmyfile=document.getElementById("myfile");myfile. =function(){letfile=myfile.files[0];//这里可以得到上传的文件对象letlength=1024*1024*5;//这里是每一个分片的大小lettotal_number=Math.ceil(file.size/length);//使用进一法,来确定分片的个数letstart=0;//分片的初始位置letend=length;//分片的结束位置letparr=[];//这里为promise.all方法准备一个数组for(leti=1;i<=total_number;i++){//这里开始分片,并且把每一个分片上传到服务器letbolb=file.slice(start,end);//得到一个分片start=end;//调整下一个分片的起始位置end=start+length;//调整下一个分片的结束位置if(end>file.size){end=file.size;//这里对最后的一个分片结束位置进行调整}letformdata=newFormData();//创建一个FormData对象,准备传送数据formdata.append("file",blob);//将分片数据放入formdataformdata.append("tempfilename",i+"_"+file.name);//同时为这个分片设置一个名称,其中的i帮助后端进行排序处理//formdata组装好之后,调用pro()函数,返回一个promise对象,并把它放入parr数组中,方便后面的promise.all方法使用parr.push(pro(formadata));}//以上for循环结束之后,parr数组中就全部是分片上传的promise的对象了,此时我们使用promise.all方法,等待所有上传都成功执行后,再向服务器发送一个请求,也就是上传完成,让服务器组装分片的请求Promise.all(parr).then(res=>{if(res.length==parr.length){//如果返回成功的数组长度和parr的数组长度相等,说明分片全部上传成功//此时对上传接口再次发送请求,同时把上传的文件名带上,方便后台查找要组装的分片文件名,因为是请求同一个上传接口,所以我们还要传一个flag=1表示这是一个数据组装的请求$.ajax({type:"post",url:"http://xxx.com/index/upload/getupload",data:{flag:1,filename:file.name},//这里flag=1表示上传完成,请求组装,filename表示要组成哪一组文件分片success:function(res){if(res.length==parr.length){console.log(111);}},fail:function(){reject()}})}})}})//这个函数用来上传分片文件,返回的是一个promise对象,方便后面使用promise.all还判断所有分片是否是上传成功的//这里要说明一下,$.post()是不可以上传文件的,只能用$.ajax()并且要把contentType:false和processData:false带上functionpro(formData){returnnewPromise((resolve,reject)=>{$.ajax({type:"post",url:"http://xxx.com/index/upload/getupload",//后台上传文件的地址data:formData,contentType:false,//这个不能少,ajax上传文件是不能少的processData:false,//这个不能少,ajax上传文件必传falsesuccess:function(res){resolve(res)},fail:function(){reject()}})})}</ >
以上就是前端的js核心部分,注释基本就可以看懂了。
php代码:
<?php//tp5框架publicfunctiongetUpload(){$tempdir=APP_PATH."../public/tempdir";//这里分片的文件指定了一个临时目录,后面会用到$flag=input("flag",0);//接收参数flag如果没有这个参数就默认为0,如果flag=1,表示要组装分片if($flag==0){//这里是上传分片$file=request()->file("file");//接收到这个分片$tempfilename=input("tempfilename");//接收到这个分片的名称,注意:这个名称中含有排序信息if(!file_exists($tempdir)){mkdir($tempdir,0755,true);//如果临时目录不存在,则创建一个临时目录}$fileinfo=$file->move($tempdir,$tmpfilename);if($fileinfo){//把分片的文件保存在了临时目录中,返回有点简单,可以根据需求返回相应的数据returnjosn(['error'=>0]);}else{returnjson(['error'=>1]);}}elseif($flag==1){//如果flag为1表示,分片已上传完成了$filename=input("filename");//通过文件名的字符串匹配,找上所有的分片,返回一个文件路径的数组$fileArr=glob($tempdir."/*".$filename);//这里的*是一个通配符,将所有的文件名中包含的$filename的文件都找到//说明一下,$fileArr中的数组的顺序不是我们想要的,所以我们新建一个数组来整理一下顺序$newfileArr=[];foreach($fileArras$f){//js前端把文件的名称前加了'序号+_',以下划线来分开并把序号写在key中$file Name= name($f);//$f是一个个的路径,这里使用 name得到文件名$file NameSplit=explode("_",$file Name);//通过下划线分割文件名$newfileArr[$file NameSplit[0]]=$f;//构造了一个新的数组,其中数组的key就是顺序号,数组的值就是分片文件的路径}//分片的序号和路径都准备好了,就可以组装了$num=count($newfileArr);//得到的所有分片的个数,为后面使用for循环做准备//开始使用for循环来组装$newfilename="new-".$filename;//这里为组装后的文件起一个名字for($i=1;$i<=$num;$i++){//这里以追加的方式,把分片文件都写入到了一个文件中file_put_contents($newfilename,file_get_contents($newfileArr[$i]),FILE_APPEND);}//......//删除临时文件中的分片文件,这里可以使用trycatch来判断是否有错误foreach($newfileArras$fi){un ($fi);}//最后给前端返回保存的文件名就可以}}
上面的方法,我本地测试上传了一个 650M的文件,只用的 20秒的时间,没有在服务器上测试过,大家可以按照这个方法试一下。
下载链接:网站源码/小程序源码/网站模板下载