这个必须记录一下费劲啊!废了我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",//url data: 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写多了写高级语言有点梦游吧,写个文字记录一下也给爱好者提个醒。