jsp实现浏览器大文件分片上传
在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载功能的实现。
先说下要求:
PC端全平台支持,要求支持Windows,Mac,Linux
支持所有浏览器。
支持文件批量上传
支持文件夹上传,且要求在服务端保留层级结构。文件夹数量要求支持到10W。
支持大文件断点续传,要求刷新浏览器,重启浏览器,重启电脑后仍然能够继续上传。文件大小要求能够支持到50个G。
支持自动加载本地文件,要求能够自动加载指定的本地文件。
支持文件批量下载,要求不要在服务器打包。因为50G的文件在服务器打包时间比较长。
支持文件夹下载,要求不要在服务器打包,下载到本地后要求保留层级结构
文件列表面板支持路径导航,新建文件夹
对于文件上传,浏览器在上传的过程中是将文件以流的形式提交到服务器端的,如果直接使用Servlet获取上传文件的输入流然后再解析里面的请求参数是比较麻烦,所以一般选择采用apache的开源工具common-fileupload这个文件上传组件。这个common-fileupload上传组件的jar包可以去apache官网上面下载,也可以在struts的lib文件夹下面找到,struts上传的功能就是基于这个实现的。common-fileupload是依赖于common-io这个包的,所以还需要下载这个包。
一、开发环境搭建
创建一个FileUploadAndDownLoad项目,加入Apache的commons-fileupload文件上传组件的相关Jar包,如下图所示:

依赖jar包如下

二、实现文件上传
前台HTML模板

文件块处理逻辑如下

保存文件块逻辑如下

web.xml配置如下

运行效果如下:

文件面板逻辑
前台代码

2.3、文件上传的细节
上述的代码虽然可以成功将文件上传到服务器上面的指定目录当中,但是文件上传功能有许多需要注意的小细节问题,以下列出的几点需要特别注意的
1、为保证服务器安全,上传文件应该放在外界无法直接访问的目录下,比如放于WEB-INF目录下。
2、为防止文件覆盖的现象发生,要为上传文件产生一个唯一的文件名。
3、为防止一个目录下面出现太多文件,要使用hash算法打散存储。
4、要限制上传文件的最大值。
5、要限制上传文件的类型,在收到上传文件名时,判断后缀名是否合法。
针对上述提出的5点细节问题,我们来改进一下UploadHandleServlet,改进后的代码如下:
文件数据表结构

文件夹数据表结构

下载数据表结构

针对上述提出的5点小细节问题进行改进之后,我们的文件上传功能就算是做得比较完善了。
三、文件下载
加载文件列表,注意,这里只列出上传完的文件和文件夹,没有上传完的就不列出了

数据库的处理逻辑比较简单,注意一下SQL语句中的条件即可

我们要将Web应用系统中的文件资源提供给用户进行下载,首先我们要有一个页面列出上传文件目录下的所有文件,当用户点击文件下载超链接时就进行下载操作,编写一个ListFileServlet,用于列出Web应用系统中所有下载文件。
文件列表加载逻辑

这里简单说一下ListFileServlet中listfile方法,listfile方法是用来列出目录下的所有文件的,listfile方法内部用到了递归,在实际开发当中,我们肯定会在数据库创建一张表,里面会存储上传的文件名以及文件的具体存放目录,我们通过查询表就可以知道文件的具体存放目录,是不需要用到递归操作的,这个例子是因为没有使用数据库存储上传的文件名和文件的具体存放位置,而上传文件的存放位置又使用了散列算法打散存放,所以需要用到递归,在递归时,将获取到的文件名存放到从外面传递到listfile方法里面的Map集合当中,这样就可以保证所有的文件都存放在同一个Map集合当中。
编写一个用于处理文件下载的Servlet,DownLoadServlet的代码如下:
文件管理器主要逻辑如下:
文件管理器所有的逻辑都在PageFileMgr.java中实现。

另外,文件管理器有一些相关的配置在data目录下

系统配置数据如下

路径配置如下

文件管理器的脚本处理全部放在index.js中

关于JavaWeb中的文件上传和下载功能的内容就这么多。
最终实现的效果如下:
文件批量上传

文件批量下载

路径导航

jsp实现浏览器大文件分片上传的更多相关文章
- .net实现浏览器大文件分片上传
以ASP.NET Core WebAPI 作后端 API ,用 Vue 构建前端页面,用 Axios 从前端访问后端 API ,包括文件的上传和下载. 准备文件上传的API #region 文件上传 ...
- asp.net实现浏览器大文件分片上传
IE的自带下载功能中没有断点续传功能,要实现断点续传功能,需要用到HTTP协议中鲜为人知的几个响应头和请求头. 一. 两个必要响应头Accept-Ranges.ETag 客户端每次提交下载请求时,服务 ...
- php实现浏览器大文件分片上传
PHP用超级全局变量数组$_FILES来记录文件上传相关信息的. 1.file_uploads=on/off 是否允许通过http方式上传文件 2.max_execution_time=30 允许脚本 ...
- Java实现浏览器大文件分片上传
上周遇到这样一个问题,客户上传高清视频(1G以上)的时候上传失败. 一开始以为是session过期或者文件大小受系统限制,导致的错误. 查看了系统的配置文件没有看到文件大小限制, web.xml中s ...
- Webuploader 大文件分片上传
百度Webuploader 大文件分片上传(.net接收) 前阵子要做个大文件上传的功能,找来找去发现Webuploader还不错,关于她的介绍我就不再赘述. 动手前,在园子里找到了一篇不错的分片 ...
- Node + js实现大文件分片上传基本原理及实践(一)
_ 阅读目录 一:什么是分片上传? 二:理解Blob对象中的slice方法对文件进行分割及其他知识点 三. 使用 spark-md5 生成 md5文件 四. 使用koa+js实现大文件分片上传实践 回 ...
- nodeJs + js 大文件分片上传
简单的文件上传 一.准备文件上传的条件: 1.安装nodejs环境 2.安装vue环境 3.验证环境是否安装成功 二.实现上传步骤 1.前端部分使用 vue-cli 脚手架,搭建一个 demo 版本, ...
- java springboot 大文件分片上传处理
参考自:https://blog.csdn.net/u014150463/article/details/74044467 这里只写后端的代码,基本的思想就是,前端将文件分片,然后每次访问上传接口的时 ...
- vue+大文件分片上传
最近公司在使用vue做工程项目,实现大文件分片上传. 网上找了一天,发现网上很多代码都存在很多问题,最后终于找到了一个符合要求的项目. 工程如下: 对项目的大文件上传功能做出分析,怎么实现大文件分片上 ...
随机推荐
- ubuntu18下Docker运行springboot项目
1.springboot项目打成jar包 mvn install 2.编写Dockerfile # 基础镜像使用java FROM java:8 # 作者 #MAINTAINER sk # VOLUM ...
- 2.2注册中心:Eureka
pom.xml配置 <?xml version="1.0" encoding="UTF-8"?><project xmlns="ht ...
- (四)循环队列 VS 数组队列 (效率对比)
目录 背景 测试代码 结果 链表 随机访问 背景 各自完成插入 10万.20万 条随机数,然后再将这些随机数出队列 : 测试代码 /** * 测试速度 */ public String testSpe ...
- Java:关于子类继承父类接口时,由于权限没有设定的更广,出错的一个小tip
今天在写笔记的时候,写的地方出现了小叉叉错号. 发现问题: 这里出错了!原因是因为在子类覆写父类的方法的时候,权限不能开的比父类更低! 加了public后,纠错成功. 由于接口类型下的方法默认都是pu ...
- 2.安装阿里yum源
1.删除自带的yum源:#cd /etc/yum.repos.d/#rm -rf * 2.配置远程yum源:wget -O /etc/yum.repos.d/CentOS-Base.repo ht ...
- T100——程序从标准签出客制后注意r.c和r.l
标准签出客制后,建议到对应4gl目录,客制目录 r.c afap280_01 r.l afap280_01 ALL 常用Shell操作命令: r.c:编译程序,需在4gl路径之下执行,产生的42m会自 ...
- Jmeter之JSON Path Extractor的使用(JSON-handle下载安装和使用)
jp@gc - JSON Path Extractor和“正则表达式提取器”使用效果一样. 他的作用单一,只提取json数据 jp@gc - JSON Path Extracto 变量名自己定义,js ...
- python+vsCode 环境搭建
先安装python环境和vscode Python下载链接:https://www.python.org/vscode下载地址:https://code.visualstudio.com/ 安装这两个 ...
- gradle安装教程
https://blog.csdn.net/andwey/article/details/92800650 https://www.cnblogs.com/Jimc/p/10081605.html
- 【fiddler】Fiddller的应用
一.fiddler抓取移动端接口 1.获取PC端IP 2.手机ip设置为与电脑同一局域网ip并配置代理 1)手机ip地址与pc地址连接同一局域网网络 2)代理设置为手动,主机名为PCip,端口号为88 ...