JavaScript上传大文件的三种解决方案

众所皆知,web上传大文件,一直是一个痛。上传文件大小限制,页面响应时间超时.这些都是web开发所必须直面的。

本文给出的解决方案是:前端实现数据流分片长传,后面接收完毕后合并文件的思路。

实现文件夹上传,要求:服务端保留层级结构,支持10w级别的文件夹上传。

大文件上传及断点续传,要求:支持50G级的单个文件上传和续传。续传要求:在刷新浏览器后能够续传上传,在重启浏览器后能够继续上传上(关闭浏览器后重新打开),在重启电脑后能够继续上传。

支持PC端全平台,Windows,Mac,Linux

浏览器要求支持全部浏览器,包括ie6,ie7,ie8,ie9,Chrome,Firefox

下面贴出简易DEMO源码分享:

前端页面:

后端代码,此Demo是基于MVC架构的:

后端代码我进行了模块划化,而不是网上的将所有的模块放在一个类中,这样对于以后的维护和升级来说都是一个灾难。

文件块处理逻辑

文件块保存逻辑如下

web.xml配置如下

整个项目的截图

依赖的JAR包如下

运行效果如下:

在此分享!希望多多指正~

后端代码逻辑大部分是相同的,目前能够支持MySQL,Oracle,SQL。在使用前需要配置一下数据库,可以参考我写的这篇文章:http://blog.ncmem.com/wordpress/2019/08/07/java超大文件上传与下载/

欢迎入群一起讨论:374992201

原文地址:https://www.cnblogs.com/songsu/p/12696146.html

时间: 2024-10-11 17:27:51

JavaScript上传大文件的三种解决方案的相关文章

PHP上传大文件的三种解决方案

前段时间做视频上传业务,通过网页上传视频到服务器. 视频大小 小则几十M,大则 1G+,以一般的HTTP请求发送数据的方式的话,会遇到的问题:1,文件过大,超出服务端的请求大小限制:2,请求时间过长,请求超时:3,传输中断,必须重新上传导致前功尽弃: 解决方案: 1,修改服务端上传的限制配置:Nginx 以及 PHP 的上传文件限制 不宜过大,一般5M 左右为好: 2,大文件分片,一片一片的传到服务端,再由服务端合并.这么做的好处在于一旦上传失败只是损失一个分片而已,不用整个文件重传,而且每个分

.NET上传大文件的三种解决方案

ASP.NET上传文件用FileUpLoad就可以,但是对文件夹的操作却不能用FileUpLoad来实现. 下面这个示例便是使用ASP.NET来实现上传文件夹并对文件夹进行压缩以及解压. ASP.NET页面设计:TextBox和Button按钮. TextBox中需要自己受到输入文件夹的路径(包含文件夹),通过Button实现选择文件夹的问题还没有解决,暂时只能手动输入. 两种方法:生成rar和zip. 1.生成rar using Microsoft.Win32; using System.Di

上传大文件&验证码

c#如何上传大文件? 想要想上传大文件,必须在web.config文件中进行配置. 在<system.web>节点中添加如下代码即可: <httpRuntime maxRequestLength="2097151"/> 这个代码就是表示设置最大请求值,上传文件也就相当于请求.maxRequestLength单位为KB,最大值为:209715 如果不设置,默认为4096 KB (4 MB). 也就是说上传的文件最大可以上传2G以内的文件. 一般没有配置的话,默认只

uploadify上传大文件

引言 之前使用Uploadify做了一个上传图片并预览的功能,今天在项目中,要使用该插件上传大文件.之前弄过上传图片的demo,就使用该demo进行测试.可以查看我的这篇文章: [Asp.net]Uploadify所有配置说明,常见bug问题分析 . 大文件上传 第一步:修改uploadify参数 1 'fileSizeLimit': '0',//单个文件大小,0为无限制,可接受KB,MB,GB等单位的字符串值 2 'fileTypeDesc': '文件',//文件描述Image Files 3

PHP+IIS上传大文件

最近刚接触IIS服务器,在使用php上传大文件的时候,遇到了一些问题.通过查阅网上资料进行了总结,希望对各位有帮助. 第一步,检查PHP的配置. 打开php.ini配置文件 1.file_uploads 设为On,允许通过HTTP上传文件 2.upload_tmp_dir 文件上传至服务器时用于临时存储的目录,如果没指定,系统会使用默认的临时文件夹(我的机器是/tmp). 3.upload_max_filesize 允许上传文件大小的最大值,默认为2M. 4.post_max_size Php可

Asp.Net上传大文件带进度条swfupload

Asp.Net基于swfupload上传大文件带进度条百分比显示,漂亮大气上档次,大文件无压力,先看效果 一.上传效果图 1.上传前界面:图片不喜欢可以自己换 2.上传中界面:百分比显示 3.上传后返回文件地址,我测试呢所以乱写的 二.核心代码 upload.htm代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml

IIS7下swfupload上传大文件出现404错误

要求上传附件大小限制在2G,原本以为可以轻松搞定.在编译模式下可以上传大文件,可是在IIS7下(自己架的服务器),一上传大的文件就会出现 Http 404错误,偶尔有的文件还有IO. error错误.一直搞不明白,在网上搜索大概了解上传控件分为两种上传模式: 1,将文件一次性读到内存中,然后再写到服务上.这样,如果文件太大就会导致服务响应变慢. 2,国外的上传控件Lion.Web.UpLoadModule,AspnetUpload(我也是通过网上搜索的),是将文件分块读取,读一些,写一些到硬盘上

上传大文件的解决方案

需求:项目要支持大文件上传功能,经过讨论,初步将文件上传大小控制在500M内,因此自己需要在项目中进行文件上传部分的调整和配置,自己将大小都以501M来进行限制. 第一步: 前端修改 由于项目使用的是BJUI前端框架,并没有使用框架本身的文件上传控件,而使用的基于jQuery的Uploadify文件上传组件,在项目使用的jslib项目中找到了BJUI框架集成jQuery Uploadify的部分,这部分代码封装在bjui-all.js文件中, 在bjui-all.js文件中的全局变量定义中有以下

WCF利用Stream上传大文件

WCF利用Stream上传大文件 转自别人的文章,学习这个例子,基本上wcf也算入门了,接口用法.系统配置都有了 本文展示了在asp.net中利用wcf的stream方式传输大文件,解决了大文件上传问题.主要是存档方便以后遇到该问题是来查阅.贴出部分代码,如果有疑惑或需要完整代码的请留言 WebForm1.aspx.cs protected void Button1_Click(object sender, EventArgs e) {             FileData file = n