html5中的File对象继承Blob二进制对象,Blob提供了一个slice函数,可以用来切割文件数据。

<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form method="post" id="myForm">
<input type="file" name="file" id="upfile" />
<input type="submit" name="submit" value="提交" />
</form>
<div id="upStatus"></div>
</body>
<script type="text/javascript">
var myForm = document.getElementById("myForm");
var upfile = document.getElementById("upfile"); myForm.onsubmit = function() {
//获取文件对象
var file = upfile.files[0];
//获取文件大小
var fileSize = file.size;
//一次截取的大小(字节)
var CutSize = 1024 * 1024 * 10;
//开始截取位置
var CutStart = 0;
//结束截取位置
var CutEnd = CutStart + CutSize;
//截取的临时文件
var tmpfile = new Blob(); while(CutStart < fileSize) {
tmpfile = file.slice(CutStart, CutEnd); //我们创建一个FormData对象
var fd = new FormData();
//把文件添加到FormData对象中
fd.append("file", tmpfile); var xhr = new XMLHttpRequest();
//这里使用同步
xhr.open("post", "upfile.php", false); //上传进度
console.log(Math.round( (CutStart + tmpfile.size) / fileSize * 100) + "%"); //发送FormData对象
xhr.send(fd);
//重新设置截取文件位置
CutStart = CutEnd;
CutEnd = CutStart + CutSize;
}
return false;
};
</script>
</html>

upfile.php代码如下:

<?php
$uploadDir = './upload/';
if(!file_exists($uploadDir)) {
@mkdir($uploadDir, 0777, true);
}
$uploadFile = $uploadDir . basename($_FILES['file']['name']); if(!file_exists($uploadFile)) {
//如果文件不存在
move_uploaded_file($_FILES['file']['tmp_name'], $uploadFile);
} else {
//如果文件已存在,追加数据
file_put_contents($uploadFile, file_get_contents($_FILES['file']['tmp_name']), FILE_APPEND);
}

php下ajax的文件切割上传的更多相关文章

  1. AJAX大文件切割上传以及带进度条。

    分块传输的原理就是利用HTML5新增的文件slice截取函数. 代码如下: html: <input id="f" type="file" name=&q ...

  2. Ajax+Java实现大文件切割上传

    技术体系:html5(formdata) + java + servlet3.0+maven + tomcat7 <!DOCTYPE html> <html> <head ...

  3. SpringMVC+Ajax实现文件批量上传和下载功能实例代码

    需求: 文件批量上传,支持断点续传. 文件批量下载,支持断点续传. 使用JS能够实现批量下载,能够提供接口从指定url中下载文件并保存在本地指定路径中. 服务器不需要打包. 支持大文件断点下载.比如下 ...

  4. Ajax实现文件的上传

    Ajax实现文件的上传 准备 ajax的参数补充 type不写的话默认是GET dataType和ContentType: dataType: 浏览器发给服务器希望返回的数据类型 .. 如果明确地指定 ...

  5. spring mvc ajax异步文件的上传和普通文件上传

    表单提交方式文件上传和ajax异步文件上传 一:首先是我在spring mvc下的表单提交方式上传 ssm的包配置我就不一一详细列出来了,但是上传的包我还是列出来 这一段我也不知道怎么给大家讲解就是直 ...

  6. 支持IE低版本的上传 大文件切割上传 断点续传 秒传

    1. http://files.cnblogs.com/files/blackice/UploadDemo.rar 此demo是使用的 swfupload 2.http://download.csdn ...

  7. ajax和原生ajax、文件的上传

    ajax理解: ajax发送的请求是异步处理的.也就是说如下形式: function f1(){ $.ajax( { ....... success:function(){ a= return a } ...

  8. AJAX-----16HTML5实现大文件切割上传

    2点多接了个电话导致失眠,没办法,跑起来接着板砖了...... 废话不多说,直接走码... <!DOCTYPE html> <html lang="en"> ...

  9. [Python]处理windows下多级目录文件,上传到Linux服务器

    #-*- coding: utf-8 -*- __author__ = 'tsbc' import sys reload(sys) sys.setdefaultencoding('utf-8') im ...

随机推荐

  1. Ubuntu-14.04.1 desktop安装时遇到的小问题

    su root认证失败:sudo passwd root,然后设置新密码. 重装linux导致g++显示已安装,但无法使用:将"系统设置"/"软件源"中所有更新 ...

  2. windows hbase installation

    In the previous post,  I have introduced how to install hadoop on windows based system. Now, I will ...

  3. css border-bottom(指定下边线的样式、宽度及颜色)

    border-bottom(指定下边线的样式.宽度及颜色) border-bottom: 值: border-bottom-style:值; border-bottom-color: 值; borde ...

  4. 使用nproxy代理本地服务到内网

    前端开发中:很多场景需要在局域网下的其他手机或设备查看网页, 问题来了, web服务部署在本机的某个端口上(8080),只能通过本机浏览器访问,  怎样能让局域网下的其他设备也访问呢?可能你会说 关闭 ...

  5. python3调用C动态库

    软硬件环境 OS X EI Capitan Python 3.5.1 GCC 4.9 前言 最近在做python3开发中,碰到了一个问题,需要通过调用C的一个动态链接库来获取相应的值.扒了扒网络,动手 ...

  6. UVA-572-搜索基础题

    题意 GeoSurvComp 地理调查公司负责发现石油存储,这次GeoSurvComp公司在一个大型矩形区域上工作,它用一个网格分割地表,然后用可感知装备来单独分析每块小方格区域下是否包含石油,有油的 ...

  7. 地址解析协议ARP(Address Resolution Protocol)

    1.引言 说明: ARP的作用,解决了什么问题: 以太网中的链路层,可能会采用不同的网络技术,而且不以ip作为路由依据. 链路层以mac地址作为路由依据. ARP的功能是在32 bit的IP地址和采用 ...

  8. 【RabbitMQ】ubuntu下RabbitMQ安装与简单使用

    参考:https://blog.csdn.net/the_fool_/article/details/80570971 1.安装: https://blog.csdn.net/a295277302/a ...

  9. IIS 更新EXE文件

    IIS 更新EXE文件 MIME,add,文件扩展名带不带.都可以,会自动加上.的 文件扩展名:.exe MIME类型:application/octet-stream .ini文件

  10. 两个关于URL解析的例子

    例一: /* 解析URL查寻串中的name=value参数对 将name=value对存储在对象属性中,并返回对象 alert(getQuery().name) */ function getQuer ...