《一个通讯专业菜鸟的"10G文件上传"奇幻漂流记》
前情提要：毕业设计の绝望
大家好！我是福州某高校通讯专业大三"准失业人员"。眼瞅着要毕业了，导师说：“做个文件管理系统当毕设吧，找工作也有个作品！” 我心想这还不简单？直到我看到需求文档…
需求清单：
- 10G文件上传（我U盘才8G啊喂！）
- 支持IE8（这玩意儿比我年纪都大！）
- 断点续传要能抗关机（这需求是灭霸提的吧？）
- 免费7×24技术支持（导师您看我像慈善机构吗？）
- 预算：0元（还倒贴电费！）
技术选型：在作死的边缘试探
前端部分（Vue3 + 原生JS混合双打）
// 大文件分片上传示例（纯原生JS版）classBigFileUploader{constructor(){this.chunkSize=5*1024*1024;// 5MB一片this.offlineStorageKey='upload-progress';// 离线存储键名}// 加密分片（祖传Base64加密法）encryptChunk(chunk){returnbtoa(unescape(encodeURIComponent(chunk)));}// 拯救IE8的IndexedDB polyfillinitDB(){if(!window.indexedDB){alert('建议您换个现代浏览器，别为难自己了！');returnPromise.reject('IE8去死吧');}// 这里省略100行兼容代码...}// 断点续传核心逻辑resumeUpload(file){consttotalChunks=Math.ceil(file.size/this.chunkSize);letsavedProgress=localStorage.getItem(this.offlineStorageKey)||0;// 从断点开始上传for(leti=savedProgress;i<totalChunks;i++){constchunk=file.slice(i*this.chunkSize,(i+1)*this.chunkSize);this.uploadChunk(chunk,i).then(()=>{localStorage.setItem(this.offlineStorageKey,i+1);});}}}后端部分（ASP.NET WebForm老古董版）
// 文件分片接收接口publicclassUploadHandler:IHttpHandler{publicvoidProcessRequest(HttpContextcontext){// 处理来自石器时代IE8的请求if(context.Request.Browser.Browser=="IE"&&context.Request.Browser.MajorVersion<=8){context.Response.Write("{"error":"建议您换个现代浏览器"}");return;}try{varfile=context.Request.Files[0];varchunkIndex=int.Parse(context.Request["chunkIndex"]);varisEncrypted=bool.Parse(context.Request["isEncrypted"]);// 解密处理（Base64祖传解密法）byte[]fileData;using(varms=newMemoryStream()){file.InputStream.CopyTo(ms);fileData=isEncrypted?Convert.FromBase64String(Encoding.UTF8.GetString(ms.ToArray())):ms.ToArray();}// 存储分片到临时目录vartempPath=$"D:\temp\{file.FileName}_{chunkIndex}";File.WriteAllBytes(tempPath,fileData);context.Response.Write("{"success":true}");}catch(Exceptionex){context.Response.Write($"{{"error":"{ex.Message}"}}");}}}兼容性解决方案（人类迷惑行为大赏）
| 浏览器 | 解决方案 | 副作用 |
|---|---|---|
| IE8 | 使用Flash插件（Adobe已停止支持） | 用户可能会先安装病毒 |
| 龙芯浏览器 | 降级到jQuery 1.x | 代码量增加300% |
| Windows 7老机器 | 禁用所有现代API | 体验回到2009年 |
| 导师的期望 | 假装所有功能都实现了 | 答辩可能翻车 |
加入我们的"毕业设计互助联盟"吧！
QQ群374992201福利：
- 加群红包1-99元（0.01元拼手气）
- 推荐项目提成20%（0元项目的20%还是0）
- 免费获取我的毕设bug（买一送十）
- 共享失业焦虑（今年就业率23%）
特别服务：
- 帮写代码（前提是你得请奶茶）
- 指导答辩（教你如何忽悠导师）
- 工作内推（推荐你去我舅的网吧当网管）
毕业设计の终极奥义
经过三天三夜的挣扎，我悟了！真正的解决方案是：
- 前端：在页面上放个超大文件上传按钮（实际最多支持10MB）
- 后端：收到文件后立即返回"上传成功"
- 演示：提前准备好假数据，全屏播放录制好的视频
- 答辩：当导师要求现场演示时，假装电脑蓝屏
优势：
- 开发成本极低
- 不挑浏览器
- 绝对不会有bug出现
- 为未来的产品经理生涯打下坚实基础
所以各位路过的神仙大佬们，救救孩子吧！这毕设要是做不出来，我就只能去继承我爸的沙县小吃了（其实想想也不错？）😭
（P.S. 真实建议：大文件上传确实复杂，可以优先实现核心功能，其他用第三方服务替代，比如七牛云就有现成的解决方案）
设置框架
安装.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
创建数据库
配置数据库连接信息
检查数据库配置
访问页面进行测试
相关参考：
文件保存位置，
效果预览
文件上传
文件刷新续传
支持离线保存文件进度，在关闭浏览器，刷新浏览器后进行不丢失，仍然能够继续上传
文件夹上传
支持上传文件夹并保留层级结构，同样支持进度信息离线保存，刷新页面，关闭页面，重启系统不丢失上传进度。
下载完整示例
下载完整示例