当前位置: 首页 > news >正文

金融行业ASP.NET大文件上传解决方案中如何加入断点续传功能?

【一个武汉刚毕业大学生的2G文件上传渡劫记:从"这能行?"到"真香!"的码农变形记】


"妈!我电脑风扇转得比光谷转盘还响了!“我冲着客厅大喊,手里攥着刚泡好的周黑鸭藕片,眼睛死死盯着屏幕上那个卡在99%的进度条。作为江汉大学计算机系刚毕业的"菜鸟码农”,我万万没想到,自己接的第一个自学项目就栽在了大文件上传这个"长江大桥"上。

第一幕:初生牛犊不怕虎(光谷步行街式自信)

"不就是上传个2G的文件吗?百度一搜全是方案!"我叼着鸭脖自信满满地打开GitHub,结果被满屏的英文文档吓得差点把辣油滴到键盘上:

  • WebUploader:看着像老式公交车的仪表盘,注释全是"此处应有注释.jpg"
  • Plupload:文档里居然有"兼容IE6"这种上古神兽的说明(就像武汉公交还有"无人售票"的标识)
  • Uppy:界面倒是时尚,但配置项多得像户部巷的小吃摊(我甚至看到了"支持WebTorrent"这种我连听都没听过的选项)

最终我选了resumable.js,就因为它有个中文Demo,而且作者头像是个二次元妹子(后来发现是AI生成的,就像光谷的"网红奶茶店"其实是个快招品牌)。

第二幕:Vue2与大文件的"热干面式纠缠"

"为什么我的分片上传会变成’随机上传’?"我盯着控制台里乱序的chunk编号,突然意识到问题可能出在:

// 我的"天才"代码(武昌口音注释)uploadChunk(chunk){// 居然用时间戳当key,就像用热干面的芝麻酱当密码constkey=Date.now()+Math.random();this.$axios.post('/api/upload',{chunk:chunk.file,key:key,// 每次请求的key都不一样,服务器当然找不到对应的分片!index:chunk.index});}

更惨的是跨浏览器兼容性测试:

  • Chrome:像光谷的地铁,说走就走
  • Firefox:像公交2号线,偶尔会卡在"螃蟹岬"
  • Edge:像共享单车,看着能用但总有点小毛病
  • IE11:直接显示"你的浏览器已过时,就像你妈说你’该找对象了’"(其实是我根本没写polyfill)

第三幕:.NET Core后端的"户部巷式拥堵"

当第一个2G文件真的传到服务器时,我的IIS直接表演了"原地爆炸":

// 最初的API(天真得像以为光谷不堵车)[HttpPost("upload")]publicasyncTaskUpload(IFormFilefile){varpath=Path.Combine("uploads",file.FileName);using(varstream=newFileStream(path,FileMode.Create)){awaitfile.CopyToAsync(stream);// 内存占用直接飙到3G,就像把整碗热干面汤喝光}returnOk();}

测试时发现:

  1. 上传100M文件:成功(像坐轮渡过江)
  2. 上传500M文件:超时(像等643路公交)
  3. 上传1G文件:IIS崩溃(像长江大桥大雾封桥)
  4. 上传2G文件:服务器蓝屏(像武汉夏天突然停电)

更搞笑的是错误处理:

// 我的"佛系"错误处理(汉口话版)try{// 上传逻辑...}catch(Exceptionex){// 反正用户也看不懂错误信息,就像我分不清武昌和汉口的公交站returnStatusCode(500,"服务器说它累了,就像你加班到晚上10点");}

第四幕:SQL Server的"东湖式迷茫"

"客户说要记录上传历史?"我盯着那台只有500G硬盘的云服务器,突然意识到问题:

-- 最初的设计(天真得像以为东湖永远不干)CREATETABLEUploadRecords(IdINTIDENTITYPRIMARYKEY,FileName NVARCHAR(255),FileSizeBIGINT,-- 2G文件就是2147483648字节UploadTimeDATETIME,StatusTINYINT-- 0=上传中 1=完成 2=失败-- 没有索引!没有分区!没有外键!就像武汉的共享单车没有头盔);

测试时发现:

  1. 插入100条记录:0.01秒(像坐地铁过江)
  2. 插入1000条记录:0.5秒(像坐公交过江)
  3. 插入10000条记录:5秒(像步行过长江大桥)
  4. 查询"未完成的任务":全表扫描(像在户部巷找特定的一家热干面摊)

第五幕:绝地求生方案(光谷特供版)

经过三天三夜的谷歌搜索(和两包精武鸭脖),我制定了新方案:

前端改造(汉味优化)

  1. 改用uppy.io(至少文档是2024年的,不像某些武汉公交时刻表)
  2. 实现真正的分片上传:
    // 用localStorage存储上传状态(武汉方言注释)constsaveState=(fileId,chunks)=>{localStorage.setItem(`upload:${fileId}`,JSON.stringify(chunks));// 就像把热干面的配方记在手机备忘录里};
  3. 添加进度条动画(用CSS让进度条跳《龙船调》)
  4. 实现断点续传(就像武汉公交司机说"莫慌,下一班马上来")

后端自救(东湖方案)

  1. MemoryMappedFile处理大文件:
    // 合并分片时不再吃内存(就像分批次吃周黑鸭)using(varmmf=MemoryMappedFile.CreateFromFile("final.dat",FileMode.Create)){for(inti=0;i<totalChunks;i++){varchunkPath=Path.Combine("uploads",fileHash,$"{i}.part");using(varchunkStream=newFileStream(chunkPath,FileMode.Open)){// 内存映射文件操作...(就像把长江分成小溪流)}}}
  2. 添加速率限制:
    // 防止客户端疯狂上传(就像限制过早摊主不能同时煮20碗热干面)app.Use(async(context,next)=>{varclientIp=context.Connection.RemoteIpAddress;varrateLimitKey=$"upload:{clientIp}";// 用简单的内存计数器(实际应该用Redis,但我还不会)if(HttpContext.Items[rateLimitKey]isintcount&&count>100){context.Response.StatusCode=429;awaitcontext.Response.WriteAsync("慢点,兄弟!武汉话叫'莫慌'!");return;}HttpContext.Items[rateLimitKey]=(count??0)+1;awaitnext();});
  3. 异步处理文件合并:
    // 用Hangfire后台任务(就像让外卖小哥先送其他单)_backgroundJobClient.Schedule(()=>MergeFile(fileHash),TimeSpan.FromMinutes(1)// 延迟1分钟合并(就像等公交时先抽根烟));

数据库优化(户部巷方案)

  1. 改用FILESTREAM存储大文件元数据(就像把鸭脖真空包装)
  2. 添加索引:
    CREATEINDEXIX_UploadRecords_StatusONUploadRecords(Status);-- 现在查询未完成的任务只要0.1秒,就像坐地铁过江
  3. 分表策略:
    -- 按月份分表(就像把不同季节的衣服分开放)CREATETABLEUploadRecords_202406(-- 结构同主表);

终幕:测试日的疯狂(光谷限定版)

当那个2.1G的《武汉城市宣传片》终于显示"上传成功"时,我激动得把鸭脖骨头卡在键盘里——至少这次没把服务器宕机,只是让整个办公室的鼠标都变得黏糊糊的(就像光谷步行街的地砖)。

客户反馈:

  • IE11:进度条显示"NaN%"(我:微笑.jpg 并默默在Nginx配置里加了if ($http_user_agent ~* "MSIE") { return 403; }
  • 360浏览器:会弹出"此网站可能存在风险"(我:这锅武汉不背!)
  • Edge浏览器:上传速度比Chrome慢30%(我:可能是武汉的网不好…吧?)

但不管怎样,当我看到SQL Server里那条完整的上传记录时,我知道自己终于跨过了这道"长江大桥"。现在,每当路过光谷软件园,我都会对着那些亮着灯的窗户说:“看!那个曾经被2G文件折磨得死去活来的菜鸟,现在也能写大文件上传了!”(虽然声音小得像武汉夏天的蚊子叫)

设置框架

安装.NET Framework 4.7.2
https://dotnet.microsoft.com/en-us/download/dotnet-framework/net472
框架选择4.7.2

添加3rd引用

编译项目

NOSQL

NOSQL无需任何配置可直接访问页面进行测试

SQL

使用IIS
大文件上传测试推荐使用IIS以获取更高性能。

使用IIS Express

小文件上传测试可以使用IIS Express

创建数据库

配置数据库连接信息

检查数据库配置

访问页面进行测试


相关参考:
文件保存位置,

效果预览

文件上传

文件刷新续传

支持离线保存文件进度,在关闭浏览器,刷新浏览器后进行不丢失,仍然能够继续上传

文件夹上传

支持上传文件夹并保留层级结构,同样支持进度信息离线保存,刷新页面,关闭页面,重启系统不丢失上传进度。

下载完整示例

下载完整示例

http://www.jsqmd.com/news/367789/

相关文章:

  • 从 0 到 1 教你用 AI 简历筛选工具,设置科学的多维度人才评估标准
  • ICM20948 设备树完整指南
  • Vibe Coding学习笔记(1):与AI结对编程,开发者的“翻译官”与“科技导演”必修课
  • 计算机毕业设计springboot基于WEB的云南省旅游网站 滇域行旅——基于SpringBoot的云南文旅服务一体化平台 云游滇境——基于微服务架构的云南智慧旅游信息门户
  • 【YOLOv8多模态涨点改进】独家创新首发 | TGRS 2025 | 引入UMIS-YOLO中的RFF残差特征融合模块,通过残差连接和多尺度特征融合,优化了目标边界的精确度,适合实例分割、小目标检测
  • 计算机毕业设计springboot基于Java的建筑物保护管理系统 基于SpringBoot的历史建筑数字化保护与运维平台 Java驱动的古建筑智能监测与修缮管理系统
  • 8款AI降AIGC率工具,赶due党速收藏!
  • 怎么把安卓手机数据导入苹果手机?这4个工具最靠谱
  • CloudFront全面优化:六大维度的蜕变
  • 降AIGC率神器实测,8款AI赶due救星!
  • PostgreSQL:万字详解逻辑备份的并行与压缩技巧
  • Java毕设项目推荐-基于springboot的慢性病健康管理系统的设计与实现基于大数据的慢性病健康管理系统【附源码+文档,调试定制服务】
  • 《构建之法》读后感(1)
  • 8款AI降AIGC神器,赶due救急超高效!
  • 降AIGC率?8款AI工具实测,赶due必看!
  • 2.10学习
  • PostgreSQL:详解如何搭建流复制集群
  • Java毕设项目推荐-基于springboot的农村康养院敬老院平台的设计与实现【附源码+文档,调试定制服务】
  • 屏幕录制器-Android studio软件源代码-java语言
  • 图片编辑器-Android studio软件源代码-java语言
  • Java 面向对象, Java 继承与多态专题题单
  • 赶due救急?8款AI降AIGC工具推荐!
  • PostgreSQL:Repmgr 管理工具,流复制的简易管理方案
  • Java毕设项目推荐-基于springboot课程排课管理系统基于springboot的教师排课管理系统【附源码+文档,调试定制服务】
  • 2026年车联网整体解决方案 - 全953页下载
  • C盘文件转移到D盘,快速复制文件
  • 彻底关闭Win11更新的6大方法【图文教程】
  • Java毕设选题推荐:基于springboot的教师排课管理系统基于springboot课程排课管理系统【附源码、mysql、文档、调试+代码讲解+全bao等】
  • 实测8款AI工具降AIGC率,赶due急救必备!
  • Java毕设选题推荐:基于springboot的农村康养院敬老院平台的设计与实现【附源码、mysql、文档、调试+代码讲解+全bao等】