html jquery上传文件,html5+jQuery文件分块上传

前端代码：

分片上传6

//方式6

$(".btnFile6").click(function () {

var upload = function (file, skip) {

var formData = new FormData();//初始化一个FormData对象

var blockSize = 1000000;//每块的大小

var nextSize = Math.min((skip + 1) * blockSize, file.size);//读取到结束位置

var fileData = file.slice(skip * blockSize, nextSize);//截取 部分文件 块

formData.append("file", fileData);//将 部分文件 塞入FormData

formData.append("fileName", file.name);//保存文件名字

$.ajax({

url: "/Home/SaveFile6",

type: "POST",

data: formData,

processData: false, // 告诉jQuery不要去处理发送的数据

contentType: false, // 告诉jQuery不要去设置Content-Type请求头

success: function (responseText) {

$(".result").html("已经上传了" + (skip + 1) + "块文件");

if (file.size <= nextSize) {//如果上传完成，则跳出继续上传

alert("上传完成");

return;

}

upload(file, ++skip);//递归调用

}

});

};

var file = $("#file6")[0].files[0];

upload(file, 0);

});

后端代码：

header('Access-Control-Allow-Origin:*');

header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");

$file = $_FILES['file'];

$filename = $file['name'];

file_put_contents($filename, file_get_contents($file['tmp_name']), FILE_APPEND);

以上代码是基础的html5+jQuery分块上传程序，前端可以继续优化，加入上传进度，后端需要判断文件类型，另存文件名，另存的时候不能直接写入，需要判断文件大小，需要在前端加上formData.append("fileSize", file.size);//文件大小传过来再判断已经写入的文件大小是否等于js传来的大小，等于则说明文件已经上传完了，这个时候才可以改名，否则文件写一块就改名，要出错，前端上传按钮可以美化，最终效果