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

ASP.NET Core 简单文件上传

news 2025/11/26 20:56:21

使用异步 JavaScript 和 XML（AJAX）进行简单的文件上传；用 C# 编写的服务器端代码。
使用AJAX和ASP.NET Core MVC上传文件再简单不过了。这不依赖于jQuery。此代码允许上传多个文件，并与 .NET Core 3.1、.NET 6和.NET 8兼容。

如果想要实现拖放版本，请参阅本文：ASP.NET Core MVC AJAX Drap-n-Drop 文件上传

注意：以下代码示例支持 ASP.NET Core。如果使用 ASP.NET MVC 5，请转到.NET Framework 示例。如果想要从服务器下载文件，请参阅本文。

首先，在 Visual Studio 中创建一个名为“Website”的 ASP.NET Core Web 应用程序 (MVC)。

首先是客户端。一半的工作由函数完成buildFormData()。有关的完整实现buildFormData()，请参阅AJAX 库源代码。

@{
Layout = null;
}
<html>
   <head>
   <title></title>
   <script type="text/javascript">
   function createXMLHttp(){
       if(typeof XMLHttpRequest != "undefined"){
           return new XMLHttpRequest();
       } else if(window.ActiveXObject){
           var aVersions = ["MSXML2.XMLHttp.5.0","MSXML2.XMLHttp.4.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp","Microsoft.XMLHttp"];
           for(var i = 0; i < aVersions.length; i++){
               try{
                   var oXmlHttp = new ActiveXObject(aVersions[i]);
                   return oXmlHttp;
               }catch(oError){
                   //void
               }
           }
       }
       throw new Error("XMLHttp object could not be created.");
   }
   //used for posting "multipart/form-data"
   function buildFormData(form_object) {
       var fd = new FormData();
       for (var i = 0; i < form_object.elements.length; i++) {
           if (form_object.elements[i].name != null && form_object.elements[i].name != "") {
               if (form_object.elements[i].type == "checkbox") {
                   if (form_object.elements[i].checked) {
                       fd.append(form_object.elements[i].name, form_object.elements[i].value)
                   }
               }
               else if (form_object.elements[i].type == "file") {
                   for (var j = 0; j < form_object.elements[i].files.length; j++) {
                       fd.append(form_object.elements[i].name,
                       form_object.elements[i].files[j],
                           form_object.elements[i].files[j].name)
                   }
               }
               else {
                   fd.append(form_object.elements[i].name, form_object.elements[i].value)
               }
           }
       }
       return fd;
   }
   function submitForm(oform)
   {
       if (window.FormData !== undefined) {
           document.getElementById("SubmitButton").disabled = true;
           var formData = buildFormData(oform);
           var xmlobj = createXMLHttp();
           xmlobj.onreadystatechange = function () {
               if (xmlobj.readyState == 4) {
                   if (xmlobj.status == 200) {
                       document.getElementById("divResponse").innerHTML = xmlobj.responseText;
                       document.getElementById("SubmitButton").disabled = false;
                   }
                   else {
                       throw new Error("Error: " + xmlobj.status + ": " + xmlobj.statusText);
                   }
               }
           };
           xmlobj.open("post", oform.action, true);
           xmlobj.send(formData);
       }
       else {
           alert("This browser does not support posting files with HTML5 and AJAX.");
       }
       return false;
   }
   </script>
   </head>
   <body>
   <form enctype="multipart/form-data" οnsubmit="return submitForm(this);" method="post" action="/Ajax/UploadFile">
       @Html.AntiForgeryToken()
       <input type="text" required name="fullname" placeholder="enter your name here" /><br />
       <input type="file" accept="image/jpeg" multiple required name="file1" /><br />
       <input type="submit" id="SubmitButton" value="Upload File(s)" />
   </form>
   <div id="divResponse"></div>
   </body>
</html>

如果您喜欢此文章，请收藏、点赞、评论，谢谢，祝您快乐每一天。

ASP.NET Core 简单文件上传

相关文章：

ASP.NET Core 简单文件上传

2502C++,C++继承的多态性

【机器学习】13.十大算法之一K均值算法（K-means）聚类详细讲解

Spring扩展点之Mybatis整合模拟

.NET MVC实现电影票管理

自媒体账号管理工具：创作罐头使用指南

基于数据可视化+SpringBoot+安卓端的数字化OA公司管理平台设计和实现

VSCode离线安装插件

基于Hadoop的汽车大数据分析系统设计与实现【爬虫、数据预处理、MapReduce、echarts、Flask】

SHELL32!Shell_MergeMenus函数分析

华为云deepseek大模型平台：deepseek满血版

AutoGen 技术博客系列八：深入剖析 Swarm—— 智能体协作的新范式

从零开始开发纯血鸿蒙应用之网页浏览

【大模型LLM】DeepSeek LLM Scaling Open-Source Language Models with Longtermism

分布式事务-本地消息表学习与落地方案

Debezium系列之：记录一次源头数据库刷数据，造成数据丢失的原因

PHP约课健身管理系统小程序源码

Java之泛型

图论之最小生成树

STM32-有关内存堆栈、map文件

【JavaEE】-- HTTP

多模态商品数据接口：融合图像、语音与文字的下一代商品详情体验

【论文阅读28】-CNN-BiLSTM-Attention-（2024）

SQL慢可能是触发了ring buffer

【无标题】路径问题的革命性重构：基于二维拓扑收缩色动力学模型的零点隧穿理论

快刀集(1): 一刀斩断视频片头广告

并发编程 - go版

华为OD机试-最短木板长度-二分法(A卷,100分)

Kubernetes 节点自动伸缩（Cluster Autoscaler）原理与实践

车载诊断架构 --- ZEVonUDS（J1979-3）简介第一篇