js分片上传大文件,前端代码
首先导入jQuery.form.js文件,下面src是相对于改js文件位置,
<script type="text/JavaScript" src="jquery/jquery-form.js"></script>
<script type="text/javascript">
var BYTES_PER_CHUNK = 1024 * 1024; // 每个文件切片大小定为1MB .
var slices;
var totalSlices;
//发送请求
function sendRequest() {
var blob = document.getElementById("file").files[0];
var start = 0;
var end;
var index = 0;
// 计算文件切片总数
slices = Math.ceil(blob.size / BYTES_PER_CHUNK);
totalSlices= slices;
while(start < blob.size) {
end = start + BYTES_PER_CHUNK;
if(end > blob.size) {
end = blob.size;
}
uploadFile(blob, index, start, end);
start = end;
index++;
if ( index>=totalSlices )
location="reboot.htm";
}
}
//上传文件
function uploadFile(blob, index, start, end) {
var xhr;
var fd;
var chunk;
var sliceIndex=blob.name+index;
chunk =blob.slice(start,end);//切割文件
fd = new FormData();
fd.append("UpgradeFileName", chunk, sliceIndex);
var xhr = new XMLHttpRequest();
xhr.open('POST', 'cmd.cgi?cmd_tag=firmware_upgrade&group_tag=upgrade', false);//false指同步上传,因为我的服务器内存较小,选择同步,如果追求速度,可以选择
//ture,异步上传
xhr.send(fd);
if((xhr.status >=200 && xhr.status < 300) || xhr.status == 304){
setTimeout("",10);
}else{
uploadFile(blob, index, start, end);
}
}
</script>
js分片上传大文件,前端代码的更多相关文章
- JS原生上传大文件显示进度条-php上传文件
JS原生上传大文件显示进度条-php上传文件 在php.ini修改需要的大小: upload_max_filesize = 8M post_max_size = 10M memory_li ...
- 【原创】MVC +WebUploader 实现分片上传大文件
大文件的上传是我一直以来想学习的一个技术点,今天在项目闲暇之时,终于有机会自己尝试了一把,本文仅仅是个Demo,各种错误处理都么有,仅限于大家来学习思路. 参考博文:http://www.cnblog ...
- js+分布上传大文件
文件夹上传:从前端到后端 文件上传是 Web 开发肯定会碰到的问题,而文件夹上传则更加难缠.网上关于文件夹上传的资料多集中在前端,缺少对于后端的关注,然后讲某个后端框架文件上传的文章又不会涉及文件夹. ...
- 用百度webuploader分片上传大文件
一般在做文件上传的时候,都是通过客户端把要上传的文件上传到服务器,此时上传的文件都在服务器内存,如果上传的是视频等大文件,那么服务器内存就很紧张,而且一般我们都是用flash或者html5做异步上传, ...
- node.js分片上传文件
前端 : <html> <head> <title>分片上传文件</title> </head> <body> <div ...
- JS上传大文件的解决方案
最近遇见一个需要上传百兆大文件的需求,调研了七牛和腾讯云的切片分段上传功能,因此在此整理前端大文件上传相关功能的实现. 在某些业务中,大文件上传是一个比较重要的交互场景,如上传入库比较大的Excel表 ...
- webApi2 上传大文件代码
上传大文件,取消内存缓存: GlobalConfiguration.Configuration.Services.Replace(typeof(IHostBufferPolicySelector), ...
- PHP代码中使用post参数上传大文件
今天连续碰到了两个同事向我反应上传大文件(8M)失败的事情! 都是在PHP代码中通常使用post参数进行上传文件时,当文件的大小大于8M时,上传不能不成功. 首先,我想到了nginx的client_m ...
- WEB上传大文件解决方案
众所皆知,web上传大文件,一直是一个痛.上传文件大小限制,页面响应时间超时.这些都是web开发所必须直面的. 本文给出的解决方案是:前端实现数据流分片长传,后面接收完毕后合并文件的思路.下面贴出简易 ...
随机推荐
- LUHN算法
LUHN算法,主要用来计算信用卡等证件号码的合法性. 1.从卡号最后一位数字开始,偶数位乘以2,如果乘以2的结果是两位数,将两个位上数字相加保存. 2.把所有数字相加,得到总和. 3.如果信用卡号码是 ...
- Net编译原理简单
转载:http://blog.csdn.net/sundacheng1989/article/details/20941893 首先简单说一下计算机软件运行.所谓软件运行,就是一步一步做一些事情.计算 ...
- windows10下运行XX-net
现在墙高了,原来配置的ip4没法用了,所以重新配置一下XX-NET,这篇博客的内容参考了末尾的网站,如果我的办法行不通可以去这个网站查看其他方法 下载XX-NET 打开https://github.c ...
- cmd:相关命令和笔记
(1)查看git版本:git --version (2)
- 使用c++11写个最简跨平台线程池
为什么需要多线程? 最简单的多线程长啥样? 为什么需要线程池,有什么问题? 实现的主要原理是什么? 带着这几个问题,我们依次展开. 1.为什么需要多线程? 大部分程序毕竟都不是计算密集型的,简单的说, ...
- 服务容错处理库Polly使用
服务容错处理库Polly使用 在进入SOA之后,我们的代码从本地方法调用变成了跨机器的通信.任何一个新技术的引入都会为我们解决特定的问题,都会带来一些新的问题.比如网络故障.依赖服务崩溃.超时.服务器 ...
- linux 安装pip 和python3
前言: python3应该是python的趋势所在,当然目前争议也比较大,这篇随笔的主要目的是记录在linux6.4下搭建python3环境的过程 以及碰到的问题和解决过程. 另外,如果本机安装了py ...
- Kali Linux重设root密码
许久不用的Kali,某天打开竟忘了密码! 网上的方法颇为简单,遂准备亲自试一下. #光标移动到第二行的“恢复模式”,按E进入[编辑模式] ...
- IDEA定位开发文件在左边工程中的文件路径
IDEA新公司入职使用第七天,基本快捷键和BUG调试已经搞透了!从最开始的配置到现在的适应确实是一个不小的进步,前几天每天加班太忙没有时间更新博客,明天就是五一假期,现在将刚掌握的一点IDEA技术写出 ...
- Yii2控制器 返回 json 格式数据
Yii::$app->response->format = Response::FORMAT_JSON; $data = User::find()->where([])->as ...