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

ASP.NET Core3.1实战教程---基于Jquery单文件上传

news 2025/7/2 11:02:35

这个必须记录一下费劲啊！废了我2天的时间，昔日的net快速已经没落....就文件上传都这么费劲。

先说下要求（在线apk文件上传实现手机端整包更新）：

1、为了简化需求文件上传和数据提交分开执行

2、选完文件后按钮变成上传

3、文件存储到项目根目录www下面

目前没做那么的现在如大小、文件类型等，看看UI

按钮发生了变化

文件上传成功

不废话了直接代码：

html代码，将上传控件做了个透明，目的是不显示难看的上传控件同时也是多浏览器显示一样。

 <div class="form-group"><label class="col-sm-3 control-label">附件<span class="red_blod">*</span></label><div class="col-sm-7"><input id="FILE_PATH" name="FILE_PATH" class="form-control" type="text"><!-- 给这个input 设置样式隐藏，切忌不可用display控制隐藏,可能不能跨浏览器 --><input type="file" id="file" name="file" onchange="getFilePath()"style="filter:alpha(opacity=0);opacity:0;width: 0;height: 0;" /></div><div class="col-sm-1"><button class="btn btn-primary" type="button" id="btnChooseFile">选择</button></div></div>

JS代码：

赋值操作将上传控件的值赋给txt控件

function getFilePath() {$("#FILE_PATH").val($("#file").val())
}

按钮状态切换和上传附件功能，灭有使用我封装加密的ajax，数据流就不加密了、成功和错误用了下封装的toast，大家自己改一下就好了。

  $("#btnChooseFile").click(function () {let button = $("#btnChooseFile")if (button.text() == "选择") {$("#file").trigger("click");$("#btnChooseFile").text("上传")} else {var fileUpload = $("#file").get(0);var files = fileUpload.files;var data = new FormData();for (var i = 0; i < files.length; i++) {data.append(files[i].name, files[i]);}//AjaxUploadFile$.ajax({type: "POST",//方法类型dataType: "json",//预期服务器返回的数据类型url: "../../../App/AjaxUploadFile",//urldata: data,contentType: false,processData: false,success: function (result) {if (result.success == "true") {$.showSuccessToast(result.message);} else {$.showErrorToast(result.message);}},error: function () {$.showErrorToast("连接服务器失败！请重试或者重新登录！");}});}});

重点来了，asp.net core 3.1 的后台代码。核心是IWebHostEnvironment的注入，人家需要放到构造函数而不是controller里，我给搞错了费劲啊看下构造

 private IWebHostEnvironment Environment;public AppController(IWebHostEnvironment _environment){Environment = _environment;}

在看一下上传文件，返回的Json我做了个封装，您们自己改一下吧。

    public JsonResult AjaxUploadFile(){try { if (Request.Form.Files.Count > 0){var files = Request.Form.Files;foreach (var file in files){var fileName = ContentDispositionHeaderValue.Parse(file.ContentDisposition).FileName.Trim('"');string filePath = Environment.WebRootPath + $@"\upload\admin\app\";if (!Directory.Exists(filePath)){Directory.CreateDirectory(filePath);}fileName = Guid.NewGuid() + "." + fileName.Split('.')[1];string fileFullName = filePath + fileName;using (var stream = new FileStream(fileFullName, FileMode.Create)){file.CopyTo(stream);}}}}catch (Exception ex) { return JsonResultError(ex.Message); }return JsonResultRight("文件上传成功！");}

好了搞定了回忆一下其实也不难，可能是我js和Python写多了写高级语言有点梦游吧，写个文字记录一下也给爱好者提个醒。

查看全文

http://www.lryc.cn/news/1430.html