基于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 相关文章推荐
基于jQuery的树控件实现代码(asp.net+json)
Jul 11 Javascript
JS实现在Repeater控件中创建可隐藏区域的代码
Sep 16 Javascript
基于jQuery实现网页打印功能
Dec 01 Javascript
js ajaxfileupload.js上传报错的解决方法
May 05 Javascript
深入浅析JS的数组遍历方法(推荐)
Jun 15 Javascript
学习Javascript闭包(Closure)知识
Aug 07 Javascript
基于bootstrap-datetimepicker.js不支持IE8的快速解决方法
Nov 07 Javascript
Node.js中看JavaScript的引用
Apr 22 Javascript
react native与webview通信的示例代码
Sep 25 Javascript
详解如何在vue项目中使用lodop打印插件
Sep 27 Javascript
浅谈Vue页面级缓存解决方案feb-alive(上)
Apr 14 Javascript
基于form-data请求格式详解
Oct 29 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 调试环境(IIS+PHP+MYSQL)
2007/01/10 PHP
PHP中怎样防止SQL注入分析
2014/10/23 PHP
PHP依赖注入(DI)和控制反转(IoC)详解
2017/06/12 PHP
JavaScript实现模仿桌面窗口的方法
2015/07/18 Javascript
深入学习JavaScript中的原型prototype
2015/08/13 Javascript
js剪切板应用clipboardData实例解析
2016/05/29 Javascript
新手学习前端之js模仿淘宝主页网站
2016/10/31 Javascript
JS判断指定dom元素是否在屏幕内的方法实例
2017/01/23 Javascript
使用vue.js实现checkbox的全选和多个的删除功能
2017/02/17 Javascript
NodeJS自定义模块写法(详解)
2017/06/27 NodeJs
详解Vue-cli中的静态资源管理(src/assets和static/的区别)
2018/06/19 Javascript
angular5 子组件监听父组件传入值的变化方法
2018/09/30 Javascript
node app 打包工具pkg的具体使用
2019/01/17 Javascript
富文本编辑器vue2-editor实现全屏功能
2019/05/26 Javascript
laydate只显示时分 不显示秒的功能实现方法
2019/09/28 Javascript
vue实现购物车的小练习
2020/12/21 Vue.js
Python中变量交换的例子
2014/08/25 Python
python使用datetime模块计算各种时间间隔的方法
2015/03/24 Python
你应该知道的python列表去重方法
2017/01/17 Python
python django 实现验证码的功能实例代码
2017/05/18 Python
Python如何快速上手? 快速掌握一门新语言的方法
2017/11/14 Python
Python使用matplotlib模块绘制图像并设置标题与坐标轴等信息示例
2018/05/04 Python
浅谈Python在pycharm中的调试(debug)
2018/11/29 Python
Python中Numpy ndarray的使用详解
2019/05/24 Python
python基于三阶贝塞尔曲线的数据平滑算法
2019/12/27 Python
利用python3 的pygame模块实现塔防游戏
2019/12/30 Python
selenium中get_cookies()和add_cookie()的用法详解
2020/01/06 Python
Django 实现 Websocket 广播、点对点发送消息的代码
2020/06/03 Python
Django filter动态过滤与排序实现过程解析
2020/11/26 Python
伦敦一家非常流行的时尚精品店:Oxygen Boutique
2017/01/15 全球购物
阿联酋航空假期:Emirates Holidays
2018/03/20 全球购物
微软中国官方商城:Microsoft Store中国
2018/10/12 全球购物
事业单位竞聘上岗实施方案
2014/03/28 职场文书
Python爬虫之用Xpath获取关键标签实现自动评论盖楼抽奖(二)
2021/06/07 Python
解决vue-router的beforeRouteUpdate不能触发
2022/04/14 Vue.js
苹果的回收机器人可以通过拆解iPhone获取大量的金和铜并外公布了环境保护最新进展
2022/04/21 数码科技