用php如何解决大文件分片上传问题


Posted in PHP onJuly 07, 2021

如果上传的文件只有小于10M的话, 就没必要考虑这样的做法, 直接在 php.ini中更改一下 upload_max_filesize = 10m post_max_size = 10m 这样就可以了, 下面我们来说一说php上传超大的文件

前提

首先, 上传超大的文件, 前端要和后端相互配合文件上传要使用 ajax 的方法, 而不是 form 的 submit的方式

思想

前端把file文件对象按一定的大小 分割成一定大小的文件(如按 2M 或 5M来分割), 对分割后的文件, 一个个的上传到后端去, 后端接收到分片文件后,把它们先放到一个临时的目录下, 在收到前端完成的数据请求的时候, 把临时目录中的文件组装起来成一个新的文件, 保存后, 把临时目录下的文件删除掉就可以了

代码

html

<div class="a">
          上传<input id="myfile" type="file" name="myfile"/>
   </div>

这里要说明一下,没有使用 submit 上传, 使用 ajax上传

javascript

<script>
	$(function(){
		let myfile = document.getElementById("myfile");
		myfile.onchange = function(){
			let file = myfile.files[0];		//这里可以得到上传的文件对象
			let length = 1024 * 1024 * 5;   //这里是每一个分片的大小
			let total_number = Math.ceil(file.size/length) //使用进一法, 来确定分片的个数
			let start = 0;			//分片的初始位置
			let end = length;		//分片的结束位置
			let parr = [];         //这里为promise.all方法准备一个数组;
			for(let i = 1;i<=total_number;i++){
				//这里开始分片, 并且把每一个分片上传到服务器
				let bolb = file.slice(start,end);  //得到一个分片
				start = end;				//调整下一个分片的起始位置
				end = start+length;			//调整下一个分片的结束位置
				if(end > file.size){
					end=file.size;		//这里对最后的一个分片结束位置进行调整
				}
				let formdata = new FormData();  //创建一个FormData对象, 准备传送数据
				formdata.append("file",blob);   //据分片数据放入 formdata
				formdata.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://fastadmin.test/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 带上
    function pro(formData){
        return new Promise((resolve,reject)=>{
            $.ajax({
                type:"post",
                url:"http://fastadmin.test/index/upload/getupload",  //后台上传文件的地址
                data:formData,
                contentType: false,    //这个不能少, ajax上传文件是不能少的
                processData: false,	   //这个不能少, ajax上传文件必传 false
                success:function(res){
                    resolve(res)
                },
                fail: function () {
                    reject()
                }
            })
        })
    }		
</script>

以上就是 前端的 js 核心部分, 注释基本就可以看懂了

php

使用的tp5的框架

public function getUpload(){
	$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){  // 这里把分片的文件保存在了临时目录中, 返回的结果有点简单, 可以根据自已的需求返回相应的数据
			return josn(['error'=>0])
		}else{
			return json(['error'=>1])
		}
	}else if($flag == 1){
		//如果flag 为 1 表示, 分片已上传完成了
		$filename = input("filename");
		//通过文件名的字符串匹配, 找上所有的分片, 返回一个文件路径的数组
		$fileArr = glob($tempdir."/*".$filename);
		// 这里的 * 是一个通配符, 它可以了所以的文件名中 包含的 $filename 的文都找到
		//说明一下, $fileArr中的数组的顺序不是我们想要的 , 所以我们新建一个数组来 整理一下顺序
		$newfileArr = [];
		foreach($fileArr as $f){
		//在js前端我们把文件的名称 前加了 序号+"_", 所以我们可以取到文件名之后, 通过 下划线来分开并把序中写在 key 中
			$filebasename = basename($f); //$f是一个个的 路径, 这里使用 basename 得到文件名
			$filebasenamesplit = explode("_",$filebasename); //通过 下划线分割文件名, 
			$newfileArr[$filebasenamesplit[0]] = $f;    //构造了一个新的数组, 其中 数组的key 就是 顺序号, 数组的值就是 分片文件的路径
		}
		//分片的序号和路径都准备好了, 就可以组装了
		$num = count($newfileArr);  //得到的所有分片的个数, 为后面使用for 循环做准务
		//开始使用for 循环来组装
		$newfilename = "huangjunhui".$filename; //这里为组装后的文件起一个名字, 可随意
		for($i = 1;$i<=$num;$i++){
			file_put_contents($newfilename,file_get_contents($newfileArr[$i]),FILE_APPEND);
			//这里以追加的方式, 把分片文件都写入到了一个文件中, 
		}
		......
		//删除临时文件中的分片文件, 这里可以使用 try catch来判断是否有错误
		foreach($newfileArr as $fi){
			unlink($fi);
		}
		//最后给前端返回 保存的文件名就可以
	}
}

上面的方法,我本地测试上传了一个 650M的文件,只用的 20秒的时间, 没有在服务器上测试过,大家可以按照这个方法试一下。

PHP 相关文章推荐
落伍首发 php+mysql 采用ajax技术的 省 市 地 3级联动无刷新菜单 源码
Dec 16 PHP
让php处理图片变得简单 基于gb库的图片处理类附实例代码下载
May 17 PHP
php URL跳转代码 减少外链
Jun 25 PHP
PHP flush()与ob_flush()的区别详解
Jun 03 PHP
将word转化为swf 如同百度文库般阅读实现思路及代码
Aug 09 PHP
PHP中使用smarty生成静态文件的例子
Apr 24 PHP
ThinkPHP Mobile使用方法简明教程
Jun 18 PHP
PHP根据图片色界在不同位置加水印的方法
Jul 01 PHP
php经典算法集锦
Nov 14 PHP
zen_cart实现支付前生成订单的方法
May 06 PHP
php面试中关于面向对象的相关问题
Feb 13 PHP
laravel实现上传图片的两种方式小结
Oct 12 PHP
php 文件上传至OSS及删除远程阿里云OSS文件
Jul 04 #PHP
PHP实现两种排课方式
Linux系统下安装PHP7.3版本
详细分析PHP7与PHP5区别
Jun 26 #PHP
laravel添加角色和模糊搜索功能的实现代码
一文搞懂php的垃圾回收机制
PHP中strval()函数实例用法
Jun 07 #PHP
You might like
php的计数器程序
2006/10/09 PHP
PHPnow安装服务[apache_pn]失败的问题的解决方法
2010/09/10 PHP
php文件上传表单摘自drupal的代码
2011/02/15 PHP
php excel reader读取excel内容存入数据库实现代码
2012/12/06 PHP
PHP基于CURL进行POST数据上传实例
2014/11/10 PHP
详解PHP版本兼容之openssl调用参数
2018/07/25 PHP
Javascript优化技巧(文件瘦身篇)
2008/01/28 Javascript
JavaScript 三种创建对象的方法
2009/10/16 Javascript
读jQuery之二(两种扩展)
2011/06/11 Javascript
iframe 上下滚动条如何默认在下方实现原理
2012/12/10 Javascript
jquery scroll()区分横向纵向滚动条的方法
2014/04/04 Javascript
一款基jquery超炫的动画导航菜单可响应单击事件
2014/11/02 Javascript
快速学习jQuery插件 Cookie插件使用方法
2015/12/01 Javascript
js轮播图代码分享
2016/07/14 Javascript
JS简单获取及显示当前时间的方法
2016/08/03 Javascript
深入理解JavaScript 参数按值传递
2017/05/24 Javascript
Angular 4 依赖注入学习教程之FactoryProvider的使用(四)
2017/06/04 Javascript
利用JavaScript对中文(汉字)进行排序实例详解
2017/06/18 Javascript
20行JS代码实现粘贴板复制功能
2018/02/06 Javascript
Vue手把手教你撸一个 beforeEnter 钩子函数
2018/04/24 Javascript
在Uni中使用Vue的EventBus总线机制操作
2020/07/31 Javascript
python处理文本文件实现生成指定格式文件的方法
2014/07/31 Python
python矩阵的转置和逆转实例
2018/12/12 Python
python买卖股票的最佳时机(基于贪心/蛮力算法)
2019/07/05 Python
django基于cors解决跨域请求问题详解
2019/08/06 Python
详解利用python识别图片中的条码(pyzbar)及条码图片矫正和增强
2020/11/17 Python
使用HTML5 Canvas API中的clip()方法裁剪区域图像
2016/03/25 HTML / CSS
使用phonegap检测网络状态的方法
2017/03/30 HTML / CSS
东芝官网商城:还原日式美学,打造美好生活
2018/12/27 全球购物
Python如何定义一个函数
2015/09/01 面试题
法院先进个人事迹材料
2014/05/04 职场文书
2014年女职工工作总结
2014/11/27 职场文书
ktv服务员岗位职责
2015/02/09 职场文书
求职自我推荐信
2015/03/24 职场文书
幼儿园新学期开学寄语
2015/05/27 职场文书
MySQL 数据库范式化设计理论
2022/04/22 MySQL