Html上传大文件
1、
<input type="file" id="file" />
<progress id="pro" value=""></progress>
<span id="output" style="font-size: 15px">等待</span><br>
<button type="button" id="upload" class="btn btn-primary">上传资源</button><br />
<input type="hidden" id="path" />
//记录文件上传状态,如果文件上传完成则为false 否则为true
var upType = false; var page = {
init: function () {
$("#upload").click($.proxy(this.upload, this));
}, upload: function () {
var file = $("#file")[0].files[0], //文件对象
name = file.name, //文件名
size = file.size, //总大小 succeed = 0;
//重新定义文件的名字,放置重复
var path = $("#path").val();
$("#path").val(path + "." + name.replace(/.+\./, ""));
name = $("#path").val();
alert(name);
var shardSize = 2 * 1024 * 1024, //以2MB为一个分片
shardCount = Math.ceil(size / shardSize); //总片数 for (var i = 0; i < shardCount; ++i) {
//计算每一片的起始与结束位置
var start = i * shardSize,
end = Math.min(size, start + shardSize); //构造一个表单,FormData是HTML5新增的
var form = new FormData();
form.append("data", file.slice(start, end)); //slice方法用于切出文件的一部分
form.append("name", name);//文件名称
form.append("total", shardCount); //总片数
form.append("index", i + 1); //当前是第几片
var pro = document.getElementById("pro");
pro.max = shardCount; //Ajax提交
$.ajax({
url: "/Product/UpfileProductResources/" + $("#hidProductId").val(),
type: "POST",
data: form,
async: true, //异步
processData: false, //很重要,告诉jquery不要对form进行处理
contentType: false, //很重要,指定为false才能形成正确的Content-Type
success: function () {
++succeed;
pro.value = succeed;
var num = (succeed / shardCount) * 100;
//展示上传的百分比
$("#output").text(num.toFixed(2) + "%");
if (succeed == shardCount) {
upType = true;
} }
});
}
}
};
$(function () {
page.init();
});
2、
/// <summary>
/// 上传产品资源
/// </summary>
/// <param name="id">产品Id</param>
/// <returns></returns>
[HttpPost]
public ActionResult UpfileProductResources(string id)
{
//从Request中取参数,注意上传的文件在Requst.Files中
string name = Request["name"];
int total = Convert.ToInt32(Request["total"]);
int index = Convert.ToInt32(Request["index"]);
var data = Request.Files["data"]; string path = ConfigurationManager.AppSettings["UpPath"].ToString();
//产品资源
string serviceLocation = "/Upload/UploadFiles/Product/Resource/";
//保存一个分片到磁盘上
string dir = PublicLibrary.Public.Files.CreatePath(path + serviceLocation); //保存一个分片到磁盘上
// string dir = Server.MapPath("~/Upload");
string file = Path.Combine(dir, name + "_" + index);
data.SaveAs(file); //如果已经是最后一个分片,组合
//当然你也可以用其它方法比如接收每个分片时直接写到最终文件的相应位置上,但要控制好并发防止文件锁冲突
if (index == total)
{
file = Path.Combine(dir, name);
var fs = new FileStream(file, FileMode.Create);
for (int i = 1; i <= total; ++i)
{
string part = Path.Combine(dir, name + "_" + i);
var bytes = System.IO.File.ReadAllBytes(part);
fs.Write(bytes, 0, bytes.Length);
bytes = null;
System.IO.File.Delete(part);
} fs.Close();
} //返回是否成功,此处做了简化处理
return Json(new { Error = 0 }); // return json;
}
Html上传大文件的更多相关文章
- [Asp.net]Uploadify上传大文件,Http error 404 解决方案
引言 之前使用Uploadify做了一个上传图片并预览的功能,今天在项目中,要使用该插件上传大文件.之前弄过上传图片的demo,就使用该demo进行测试.可以查看我的这篇文章:[Asp.net]Upl ...
- php 上传大文件配置upload_max_filesize和post_max_size选项
php 上传大文件配置upload_max_filesize和post_max_size选项 (2014-04-29 14:42:11) 转载▼ 标签: php.ini upload _files[f ...
- PHP上传大文件 分割文件上传
最近遇到这么个情况,需要将一些大的文件上传到服务器,我现在拥有的权限是只能在一个网页版的文件管理系统来进行操作,可以解压,可以压缩,当然也可以用它来在线编辑.php文件. 文件有40M左右,但是服务器 ...
- ASP.NET上传大文件的问题
原文:http://www.cnblogs.com/wolf-sun/p/3657241.html?utm_source=tuicool&utm_medium=referral 引言 之前使用 ...
- php 上传大文件主要涉及配置upload_max_filesize和post_max_size两个选项
php 上传大文件主要涉及配置 upload_max_filesize 和post_max_size两个选项 今天在做上传的时候出现一个非常怪的问题,有时候表单提交可以获取到值,有时候就获取不到了 ...
- SWFUpload上传大文件(暂时用用,真正用的时候还是要改的)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- PHP上传大文件和处理大数据
1. 上传大文件 /* 以1.5M/秒的速度写入文件,防止一次过写入文件过大导致服务器出错(chy/20150327) */ $is_large_file = false; if( strlen($x ...
- QQ上传大文件为什么这么快
今天和同事在群里讨论“QQ上传大文件/QQ群发送大文件时,可以在极短的时间内完成”是如何做到的. 有时候我们通过QQ上传一个几百M的文件,竟然只用了几秒钟,从带宽上限制可以得出,实际上传文件是不可能的 ...
- IIS7下swfupload上传大文件出现404错误
要求上传附件大小限制在2G,原本以为可以轻松搞定.在编译模式下可以上传大文件,可是在IIS7下(自己架的服务器),一上传大的文件就会出现 Http 404错误,偶尔有的文件还有IO. error错误. ...
- php无法上传大文件完美解决方案
php.ini无法上传大文件完美解决办法 1.打开php.ini(打开方式就不用说了,百度一大堆) 2.查找post_max_size 表单提交最大数值,此项不是限制上传单个文件的大小,而是针对整个表 ...
随机推荐
- WordCloud 简介
WordCloud 简介 GitHub GitHub:https://github.com/amueller/word_cloud example:https://github.com/amuelle ...
- MySQL数据库(三)
1. 创建表 create table student( id int unsigned not null auto_increment primary key, name varchar(8) no ...
- Django 标签过滤器
django内置标签 autoescape 控制当前的自动转义行为.这个标记可以作为参数打开或关闭,它决定自动转义是否在块内有效.块使用endautoescape结束标记关闭. 当自动转义生效时,所有 ...
- 广告小程序后端开发(2.Models设计)
1.users的数据表设计: 1.重建用户表: 1.在settings中配置: AUTH_USER_MODEL='users.UserProfile' 2.apps/users/models.py中建 ...
- Mysql数据类型《四》日期类型
日期类型 DATE TIME DATETIME TIMESTAMP YEAR 作用:存储用户注册时间,文章发布时间,员工入职时间,出生时间,过期时间等 YEAR YYYY(1901/2155) DAT ...
- 线程概要 Java
线程 进程和线程的区别 串行:初期的计算机只能串行执行任务,大量时间等待用户输入 批处理:预先将用户的指令集中成清单,批量串行处理用户指令,仍然无法并发执行 进程:进程独占内存空间,保存各自运行状态, ...
- 洛谷P3643 [APIO2016]划艇(组合数学)
题面 传送门 题解 首先区间个数很少,我们考虑把所有区间离散化(这里要把所有的右端点变为\(B_i+1\)代表的开区间) 设\(f_{i,j}\)表示考虑到第\(i\)个学校且第\(i\)个学校必选, ...
- Ionic——下一代 APP 开发框架
http://www.tuicool.com/articles/iY3ENvY 最近 Facebook React 团队释出了 React Native, 用来构建 Mobile Native 应用. ...
- np.random.normal()
高斯分布(Gaussian Distribution)的概率密度函数(probability density function): \[ f(x)=\frac1{\sqrt{2\pi}\sigma}\ ...
- PHP会话cookie类的封装
<?php header('content-type:text/html;charset=utf-8');/** * 完成cookie的设置.删除.更新.读取 */class Cookie{ ...