前端与JAVA后端分块上传的协同实现经验
《Java老哥的100元奇迹》
各位同行好啊！我是一名来自甘肃的Java老程序员，最近接了个"史诗级"外包项目——预算高达100元人民币！这价格连兰州牛肉面都吃不了几碗，但客户要的功能怕是马化腾来了都得摇头…
一、需求分析：100元买航母
客户要求清单：
- 20G文件上传：我家宽带一个月流量都没20G
- IE9兼容：“业务机器不能扔”——这话听着就像"我爷爷的算盘还能用"
- 文件夹结构保持：1000个分类文件层级不能乱，这需求比我家的族谱还复杂
- 断点续传：关了浏览器进度不能丢，这功能应该叫"程序员寿命续传"
- 加密存储：SM4+AES双加密，我银行卡密码都没这么安全
- 7×24小时支持：100元买我命？
二、技术选型：用爱发电
前端方案（Vue3 + 原生JS地狱）
// 文件夹上传核心代码（IE9特别版）functionhandleFolderUpload(files){constpromise=newPromise((resolve,reject)=>{if(navigator.userAgent.indexOf('MSIE 9')>-1){alert('IE9用户请先升级到Windows 10');reject('建议客户扔掉这台电脑');}else{// 实际处理代码resolve('上传成功（可能）');}});returnpromise;}后端方案（SpringBoot魔改版）
// 文件分片接收接口@PostMapping("/upload")publicResponseEntityupload(@RequestParam("file")MultipartFilefile,@RequestParam("chunkNumber")intchunkNumber,@RequestParam("totalChunks")inttotalChunks,HttpServletRequestrequest){// 预算只够写伪代码if(file.getSize()>20_000_000_000L){returnResponseEntity.badRequest().body("加钱！");}try{// 假装这里有很多代码returnResponseEntity.ok("第"+chunkNumber+"块上传成功");}catch(Exceptione){returnResponseEntity.status(500).body("建议预算加两个零");}}三、加密实现（玄学版）
// SM4加密（伪代码）publicclassSM4Utils{publicstaticStringencrypt(Stringinput){// 真实实现需要300行代码// 但100元预算只配用Base64returnBase64.getEncoder().encodeToString(input.getBytes());}}四、文件夹结构保持黑科技
// 数据库设计（精简版）@EntitypublicclassFileNode{@IdprivateStringid;privateStringpath;// 如 "/root/folder/file.txt"privatebooleanisDirectory;// 其他字段...}五、断点续传实现思路
- 前端计算文件hash作为唯一标识
- 后端记录已上传分片信息
- 每次上传前先查询上传进度
// 断点记录表@EntitypublicclassUploadProgress{@IdprivateStringfileHash;privateStringfileName;privateStringfilePath;privateinttotalChunks;privateStringuploadedChunks;// 如 "1,3,5-8"}六、现实建议
- 价格谈判：建议把单位从人民币改成比特币
- IE9兼容：直接告诉客户加钱换电脑更划算
- 20G文件：先确认客户服务器硬盘有多大
- 时间估算：100元预算≈1小时工作量（含做梦时间）
七、QQ群真相揭秘
“加群送红包”：我加了群只收到空气红包
“项目提成50%”：最后发现是项目亏损的50%
“互联网大厂待遇”：大厂起码给交五险一金啊！
八、生存指南
- 需求评审：把不合理需求都标成"加钱项"
- 技术方案：尽量用现成轮子（虽然预算买不起）
- 合同签订：写明"IE9支持需要额外付费"
- 心态调整：准备好改行送外卖的Plan B
完整解决方案（做梦版）
如果真的不得不做：
- 前端用Vue3+WebUploader魔改
- 后端用SpringBoot+分片上传
- 数据库记录文件树结构
- 加密用Bouncy Castle库
但老哥们，100元连代码自动补全会员都买不起啊！要不咱们组团去送外卖吧？听说一个月能挣好几个100元呢！(手动狗头)
最后的呐喊：那个QQ群广告才是重点吧！老哥你其实是想拉人头对不对？（看破不说破）
导入项目
导入到Eclipse：点南查看教程
导入到IDEA：点击查看教程
springboot统一配置：点击查看教程
工程
NOSQL
NOSQL示例不需要任何配置，可以直接访问测试
创建数据表
选择对应的数据表脚本，这里以SQL为例
修改数据库连接信息
访问页面进行测试
文件存储路径
up6/upload/年/月/日/guid/filename
效果预览
文件上传
文件刷新续传
支持离线保存文件进度，在关闭浏览器，刷新浏览器后进行不丢失，仍然能够继续上传
文件夹上传
支持上传文件夹并保留层级结构，同样支持进度信息离线保存，刷新页面，关闭页面，重启系统不丢失上传进度。
下载示例
点击下载完整示例