news 2026/2/4 1:58:17

.NET MVC如何设计大文件上传的权限控制与验证机制?

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
.NET MVC如何设计大文件上传的权限控制与验证机制?

大文件上传系统开发指南(兼容IE8的Vue3+WebForm实现)

项目概述

嘿,兄弟!听说你接了个"不可能完成的任务"?20G文件上传、兼容IE8、还要保留文件夹结构?别慌,让我这个老江湖带你飞!虽然预算只有100块,但咱们程序员不就是喜欢挑战极限嘛!

系统架构

  • 前端:Vue3 CLI(但为了IE8兼容,我们得用点黑科技)
  • 后端:ASP.NET WebForm(SQL Server数据库)
  • 文件存储:服务器E盘
  • 传输加密:SM4/AES(前端加密,后端解密)
  • 断点续传:本地存储+服务器记录

前端实现(兼容IE8的"现代"方案)

1. 兼容IE8的Vue3环境搭建

大文件上传系统

2. 文件夹上传组件(原生JS实现)

// src/components/FolderUploader.vueexportdefault{data(){return{fileList:[],isUploading:false,chunkSize:5*1024*1024,// 5MB每片encryptKey:'this-is-a-32-byte-key-for-aes-256'// 实际项目中应该从服务器获取}},methods:{triggerFileInput(){document.getElementById('fileInput').click();},uploadChunk(relativePath,chunk,chunkIndex,totalChunks,totalSize,fileObj){returnnewPromise((resolve,reject)=>{constformData=newFormData();formData.append('filePath',relativePath);formData.append('chunkIndex',chunkIndex);formData.append('totalChunks',totalChunks);formData.append('totalSize',totalSize);formData.append('chunk',newBlob([chunk]));formData.append('fileId',this.generateFileId(fileObj.file));constxhr=newXMLHttpRequest();xhr.open('POST','/api/Upload/UploadChunk',true);xhr.upload.onprogress=function(e){if(e.lengthComputable){// 更新单个文件的进度(这里简化处理)}};xhr.onload=function(){if(xhr.status===200){resolve(JSON.parse(xhr.responseText));}else{reject(newError('上传文件片失败'));}};xhr.onerror=function(){reject(newError('网络错误'));};xhr.send(formData);});},generateFileId(file){// 生成文件唯一ID(用于断点续传)returnfile.name+'-'+file.size+'-'+file.lastModified;},formatFileSize(bytes){if(bytes===0)return'0 Bytes';constk=1024;constsizes=['Bytes','KB','MB','GB'];consti=Math.floor(Math.log(bytes)/Math.log(k));returnparseFloat((bytes/Math.pow(k,i)).toFixed(2))+' '+sizes[i];}}}

后端实现(ASP.NET WebForm)

1. 上传处理API

// UploadHandler.ashx<%@WebHandlerLanguage="C#"Class="UploadHandler"%>publicclassUploadHandler:IHttpHandler{privatestaticreadonlystringUploadFolder=@"E:\UploadedFiles\"; private static readonly string ConnectionString = System.Configuration.ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString;publicvoidProcessRequest(HttpContextcontext){context.Response.ContentType="application/json";try{if(context.Request.HttpMethod=="POST"){if(context.Request.Path.Contains("InitUpload")){HandleInitUpload(context);}}}catch(Exceptionex){context.Response.Write(Newtonsoft.Json.JsonConvert.SerializeObject(new{success=false,message=ex.Message}));}}privatevoidHandleInitUpload(HttpContextcontext){// 读取前端发送的文件结构using(varreader=newStreamReader(context.Request.InputStream)){varjson=reader.ReadToEnd();varstructure=Newtonsoft.Json.JsonConvert.DeserializeObject(json);Directory.CreateDirectory(tempFolder);// 保存文件结构信息(实际应用中应该存入数据库)File.WriteAllText(Path.Combine(tempFolder,"structure.json"),json);context.Response.Write(Newtonsoft.Json.JsonConvert.SerializeObject(new{success=true,sessionId=sessionId,message="上传初始化成功"}));}}privatevoidHandleUploadChunk(HttpContextcontext){varfilePath=context.Request.Form["filePath"];varchunkIndex=int.Parse(context.Request.Form["chunkIndex"]);vartotalChunks=int.Parse(context.Request.Form["totalChunks"]);vartotalSize=long.Parse(context.Request.Form["totalSize"]);varfileId=context.Request.Form["fileId"];varsessionId=context.Request.Form["sessionId"];// 应该从cookie或header中获取context.Response.Write(Newtonsoft.Json.JsonConvert.SerializeObject(new{success=true,chunkIndex=chunkIndex,message="文件片上传成功"}));}publicboolIsReusable=>false;}

2. 下载处理API

// DownloadHandler.ashx<%@WebHandlerLanguage="C#"Class="DownloadHandler"%>publicclassDownloadHandler:IHttpHandler{privatestaticreadonlystringUploadFolder=@"E:\UploadedFiles\"; public void ProcessRequest(HttpContext context) { try { var filePath = context.Request.QueryString["path"];if(string.IsNullOrEmpty(filePath)){thrownewException("未指定文件路径");}// 防止目录遍历攻击filePath=Path.GetFullPath(Path.Combine(UploadFolder,filePath));if(!filePath.StartsWith(Path.GetFullPath(UploadFolder))){thrownewException("无效的文件路径");}}catch(Exceptionex){context.Response.StatusCode=500;context.Response.Write(ex.Message);}}publicboolIsReusable=>false;}

IE8兼容性处理

由于IE8不支持很多现代API,我们需要做以下兼容处理:

  1. File API兼容

    • IE8不支持FileFileReaderAPI,我们需要使用ActiveX或Flash作为后备方案
    • 但考虑到Flash已淘汰,我们可以提示用户升级浏览器或使用传统上传方式
  2. XMLHttpRequest兼容

    • IE8使用XDomainRequest进行跨域请求
    • 但我们的场景是同源,所以标准的XMLHttpRequest足够
  3. JSON兼容

    • 引入JSON2.js或JSON3.js作为polyfill
  4. Vue兼容

    • 使用Vue 2.x而不是Vue 3,因为Vue 3不支持IE8-10

修改后的前端入口(兼容IE8)

// src/main.js (兼容IE8版本)// 使用Vue 2.ximportVuefrom'vue';importVueRouterfrom'vue-router';importAppfrom'./App.vue';// 兼容性检查if(!window.console){window.console={log:function(){},error:function(){},warn:function(){}};}// 注册Vue插件Vue.use(VueRouter);// 路由配置constrouter=newVueRouter({routes:[{path:'/',component:()=>import('./components/FolderUploader.vue')}]});// 创建Vue实例newVue({el:'#app',router,render:h=>h(App)});

部署说明

  1. IIS配置

    • 确保启用ASP.NET功能
    • 增加上传文件大小限制(在Web.config中):
  2. 数据库准备

    CREATETABLEUploadedFiles(IdINTIDENTITY(1,1)PRIMARYKEY,FilePath NVARCHAR(1000)NOTNULL,SizeBIGINTNOTNULL,UploadDateDATETIMENOTNULL,SessionId NVARCHAR(36)NOTNULL,UserId NVARCHAR(128)NULL-- 如果有用户系统);CREATETABLEUploadSessions(SessionId NVARCHAR(36)PRIMARYKEY,UserId NVARCHAR(128)NULL,StartTimeDATETIMENOTNULL,LastActiveDATETIMENOTNULL,StatusNVARCHAR(50)NOTNULL,FileStructure NVARCHAR(MAX)NULL);
  3. 文件夹权限

    • 确保IIS应用池账户对E盘有读写权限

开发文档要点

  1. 系统架构

    • 前端:Vue2 + 原生JS(兼容IE8)
    • 后端:ASP.NET WebForm + SQL Server
    • 存储:服务器E盘
  2. 功能说明

    • 文件夹上传(保留结构)
    • 大文件分片上传
    • 断点续传
    • 加密传输(示例中简化处理)
    • 兼容IE8+现代浏览器
  3. 限制说明

    • IE8下无法实现真正的文件夹选择(只能提示用户压缩后上传)
    • 加密功能在IE8下需要简化处理
  4. 部署步骤

    • 配置IIS
    • 设置数据库连接字符串
    • 配置上传文件夹权限

总结

兄弟,这个项目确实有挑战性,但并非不可能完成。关键点在于:

  1. 分层处理:现代浏览器用现代方案,老旧浏览器用简化方案
  2. 渐进增强:先实现基本功能,再逐步添加高级特性
  3. 性能优化:分片上传、本地存储进度是关键

虽然预算只有100块,但我们可以:

  • 使用开源组件
  • 简化加密实现(或让服务器处理加密)
  • 重点保证核心功能

记住,咱们程序员的价值不在于代码量,而在于解决问题的能力!这个项目搞定了,你的技术水平绝对能上一个台阶,以后接单更有底气!

最后,欢迎加入我们的QQ群:374992201,一起交流技术,一起接单赚钱!群里还有红包和提成活动,说不定你的下一个项目就来自群里的兄弟呢!

设置框架

安装.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

创建数据库

配置数据库连接信息

检查数据库配置

访问页面进行测试


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

效果预览

文件上传

文件刷新续传

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

文件夹上传

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

下载完整示例

下载完整示例

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/2/2 22:47:51

别再用LoadRunner了!Open-AutoGLM的这5个优势让你立即切换

第一章&#xff1a;为什么是时候告别LoadRunner随着现代应用架构向微服务、容器化和云原生演进&#xff0c;传统性能测试工具已难以匹配当前的开发与部署节奏。LoadRunner 作为上世纪90年代诞生的负载测试工具&#xff0c;尽管在企业级测试中曾占据主导地位&#xff0c;但其封闭…

作者头像 李华
网站建设 2026/2/3 15:55:46

Open-AutoGLM单据提交倒计时:月底前必须掌握的5项提报技能

第一章&#xff1a;Open-AutoGLM单据提交的核心机制解析 Open-AutoGLM 是一个基于大语言模型驱动的自动化单据处理系统&#xff0c;其核心机制在于通过语义理解与结构化数据映射实现非标准化输入到标准业务单据的自动转换。该系统在接收用户自然语言描述后&#xff0c;能够识别…

作者头像 李华
网站建设 2026/2/2 4:57:41

Sed命令学习总结

一、sed所有命令 a\ 在当前行下面插入文本; i\ 在当前行上面插入文本; c\ 把选定的行改为新的文本; d 删除,删除选择的行; D 删除模板块的第一行; s 替换指定字符 h 拷贝模板块的内容到内存中的缓冲区; H 追加模板块的内容到内存中的缓冲区; g 获得内存缓冲区…

作者头像 李华
网站建设 2026/2/2 16:34:50

PPO算法训练机械臂动作进行超参数调优

PPO 算法训练机械臂动作时的超参数调优方法&#xff0c;这是提升训练效率、避免震荡、实现高精度控制的关键环节。以下是针对性的超参调优体系&#xff0c;涵盖核心超参、调优流程、实操技巧与问题应对&#xff1a;一、先明确核心超参分类&#xff08;按优先级排序&#xff09;…

作者头像 李华
网站建设 2026/2/2 16:26:34

Open-AutoGLM中断恢复为何如此高效?解析背后不为人知的3层状态快照架构

第一章&#xff1a;Open-AutoGLM中断恢复为何如此高效&#xff1f;Open-AutoGLM 在大规模语言模型训练中引入了创新的中断恢复机制&#xff0c;显著提升了任务容错性与资源利用率。其核心在于状态快照与异步检查点的协同设计&#xff0c;使得训练进程在意外中断后能以极低延迟恢…

作者头像 李华
网站建设 2026/2/2 2:42:17

Open-AutoGLM认证机制全剖析:如何在30分钟内解决授权异常?

第一章&#xff1a;Open-AutoGLM认证失败处理优化在使用 Open-AutoGLM 框架进行自动化推理服务部署时&#xff0c;API 认证失败是常见问题之一。为提升系统的容错能力与用户体验&#xff0c;需对认证失败场景进行精细化处理&#xff0c;避免因短暂网络波动或凭证过期导致服务中…

作者头像 李华