基于JavaScript实现大文件上传后端代码实例


Posted in Javascript onAugust 18, 2020

这里只写后端的代码,基本的思想就是,前端将文件分片,然后每次访问上传接口的时候,向后端传入参数:当前为第几块文件,和分片总数

下面直接贴代码吧,一些难懂的我大部分都加上注释了:

上传文件实体类:

看得出来,实体类中已经有很多我们需要的功能了,还有实用的属性。如MD5秒传的信息。

基于JavaScript实现大文件上传后端代码实例

首先是文件数据接收逻辑,负责接收控件上传的文件块数据,然后写到服务器的文件中。控件已经提供了块的索引,大小,MD5和长度信息,我们可以根据需要来灵活进行处理,也可以将文件块的数据保存到分布式存储系统中。

基于JavaScript实现大文件上传后端代码实例

文件初始化部分

基于JavaScript实现大文件上传后端代码实例

第一步:获取RandomAccessFile,随机访问文件类的对象

第二步:调用RandomAccessFile的getChannel()方法,打开文件通道 FileChannel,这块逻辑可以优化,如果以后有分布式存储需求,可以改为分布式存储,减轻单台服务器的压力。

基于JavaScript实现大文件上传后端代码实例

第三步:获取当前是第几个分块,计算文件的最后偏移量

第四步:获取当前文件分块的字节数组,用于获取文件字节长度

第五步:使用文件通道FileChannel类的 map()方法创建直接字节缓冲器MappedByteBuffer

第六步:将分块的字节数组放入到当前位置的缓冲区内mappedByteBuffer.put(byte[] b);

第七步:释放缓冲区

第八步:检查文件是否全部完成上传

基于JavaScript实现大文件上传后端代码实例

文件夹扫描类

基于JavaScript实现大文件上传后端代码实例

存储路径生成类

基于JavaScript实现大文件上传后端代码实例

好了,到此就全部结束了,如果有疑问或批评,欢迎评论和私信,我们一起成长一起学习。

最后放一张实现的效果图

基于JavaScript实现大文件上传后端代码实例

后端代码逻辑大部分是相同的,目前能够支持MySQL,Oracle,SQL。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
让iframe框架网页在任何浏览器下自动伸缩
Aug 18 Javascript
面向对象Javascript核心支持代码分享
May 23 Javascript
页面载入结束自动调用js函数示例
Sep 23 Javascript
js获取窗口相对于屏幕左边和上边的位置坐标
May 15 Javascript
jQuery左右滚动支持图片放大缩略图图片轮播代码分享
Aug 26 Javascript
基于JS模仿windows文件按名称排序效果
Jun 29 Javascript
基于bootstrap实现广告轮播带图片和文字效果
Jul 22 Javascript
jQuery动态添加与删除tr行实例代码
Oct 18 Javascript
JS前端加密算法示例
Dec 22 Javascript
使用vue重构资讯页面的实例代码解析
Nov 26 Javascript
react-router-dom 嵌套路由的实现
May 02 Javascript
react国际化react-intl的使用
May 06 Javascript
javascript实现扫雷简易版
Aug 18 #Javascript
详解Vue的组件中data选项为什么必须是函数
Aug 17 #Javascript
Openlayers实现扩散的动态点(水纹效果)
Aug 17 #Javascript
openLayer4实现动态改变标注图标
Aug 17 #Javascript
openlayers4实现点动态扩散
Aug 17 #Javascript
Vue实现计算器计算效果
Aug 17 #Javascript
vue-model实现简易计算器
Aug 17 #Javascript
You might like
PHP stristr() 函数(不区分大小写的字符串查找)
2010/06/03 PHP
Yii实现简单分页的方法
2016/04/29 PHP
PHP token验证生成原理实例分析
2019/06/05 PHP
js中关于new Object时传参的一些细节分析
2011/03/13 Javascript
解析瀑布流布局:JS+绝对定位的实现
2013/05/08 Javascript
jquery定时滑出可最小化的底部提示层特效代码
2013/10/02 Javascript
CSS3,HTML5和jQuery搜索框集锦
2014/12/02 Javascript
Position属性之relative用法
2015/12/14 Javascript
Angularjs中$http以post请求通过消息体传递参数的实现方法
2016/08/05 Javascript
详解jQuery简单的表单应用
2016/12/16 Javascript
js实现文字列表无缝滚动效果
2017/06/23 Javascript
promise处理多个相互依赖的异步请求(实例讲解)
2017/08/03 Javascript
React Native中TabBarIOS的简单使用方法示例
2017/10/13 Javascript
详解webpack4升级指南以及从webpack3.x迁移
2018/06/12 Javascript
JavaScript实现H5接金币功能(实例代码)
2021/02/22 Javascript
vue 数据双向绑定的实现方法
2021/03/04 Vue.js
python文件和目录操作函数小结
2014/07/11 Python
python继承和抽象类的实现方法
2015/01/14 Python
Python 内置函数complex详解
2016/10/23 Python
Python自定义线程池实现方法分析
2018/02/07 Python
Python 实现网页自动截图的示例讲解
2018/05/17 Python
selenium+python实现自动化登录的方法
2018/09/04 Python
python快速编写单行注释多行注释的方法
2019/07/31 Python
关于windows下Tensorflow和pytorch安装教程
2020/02/04 Python
python3 logging日志封装实例
2020/04/08 Python
python实现杨辉三角的几种方法代码实例
2021/03/02 Python
HTML5+WebSocket实现多文件同时上传的实例
2016/12/29 HTML / CSS
汉森批发:Hansen Wholesale
2018/05/24 全球购物
写一个函数返回1+2+3+…+n的值(假定结果不会超过长整型变量的范围)
2014/09/05 面试题
青年创业培训欢迎词
2014/01/10 职场文书
客户表扬信范文
2014/01/10 职场文书
孝老爱亲模范事迹
2014/01/24 职场文书
英语教学随笔感言
2014/02/20 职场文书
2019消防宣传标语!
2019/07/10 职场文书
vue实现登陆页面开发实践
2022/05/30 Vue.js
Mysql数据库group by原理详解
2022/07/07 MySQL