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

news2024/11/26 20:27:52

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/336222.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

web前端——HTML+CSS

整体框架 HTML CSS CSS进阶 CSS盒子模型 定位装饰 CSS精灵图 目录 基础认识 HTML 一、HTML概念 二、HTML页面固定结构 三、HTML标签的结构 四、标签学习 1、排版标签 1&#xff09;标题标签 2&#xff09;段落标签 3&#xff09;换行标签 4&#xff09;水平线…

【LeetCode】1223. 掷骰子模拟

1223. 掷骰子模拟 题目描述 有一个骰子模拟器会每次投掷的时候生成一个 1 到 6 的随机数。 不过我们在使用它时有个约束&#xff0c;就是使得投掷骰子时&#xff0c;连续 掷出数字 i 的次数不能超过 rollMax[i]&#xff08;i 从 1 开始编号&#xff09;。 现在&#xff0c;…

第八节 Linux 设备树

Linux3.x 以后的版本才引入了设备树&#xff0c;设备树用于描述一个硬件平台的板级细节。在早些的linux内核&#xff0c;这些“硬件平台的板级细节”保存在linux 内核目录“/arch”&#xff0c;以ARM 平台为例“硬件平台的板级细节”保存在“/arch/arm/plat-xxx”和“/arch/arm…

python面试准备之--算法一

文章目录时间复杂度空间复杂度递归汉诺塔问题&#xff08;递归实例&#xff09;查找列表查找顺序查找&#xff08;Linear Search&#xff09;二分查找排序列表排序冒泡排序(Bubble Sort)选择排序插入排序快速排序堆排序归并排序希尔排序计数排序基数排序时间复杂度 时间复杂度是…

机器(深度)学习中的 Dropout

在这篇文章[1]中&#xff0c;我将主要讨论神经网络中 dropout 的概念&#xff0c;特别是深度网络&#xff0c;然后进行实验&#xff0c;通过在标准数据集上实施深度网络并查看 dropout 的影响&#xff0c;看看它在实践中实际影响如何。 1. Dropout是什么&#xff1f; ★ 术语“…

迷宫最短路径【Java实现】

题目描述 现有一个n∗m大小的迷宫&#xff0c;其中1表示不可通过的墙壁&#xff0c;0表示平地。每次移动只能向上下左右移动一格&#xff0c;且只能移动到平地上。假设左上角坐标是(1,1)&#xff0c;行数增加的方向为x增长的方向&#xff0c;列数增加的方向为y增长的方向&#…

Protocol Buffers V3语法全解

目录protobuf介绍protobuf使用protoc命令语法定义消息类型指定字段类型分配字段编号指定字段规则添加更多消息类型注释保留字段从.proto文件生成了什么&#xff1f;值类型默认值枚举使用其他消息类型导入定义嵌套类型更新消息类型未知字段any任意类型oneofoneof 特性兼容性问题…

awk命令

一.介绍 awk是专门为文本处理设计的编程语言&#xff0c;是一门数据驱动的编程语言。与sed类似&#xff0c;都是以数据驱动的行处理软件&#xff0c;主要用于数据扫描&#xff0c;过滤和汇总。数据可以来自于标准输入&#xff0c;管道或者文件。 二.语法 awk是一种处理文本文件…

Vite+Vue3实现版本更新检查,实现页面自动刷新

ViteVue3实现版本更新检查&#xff0c;实现页面自动刷新1、使用Vite插件打包自动生成版本信息2、Vite.config.ts配置3、配置环境变量4、路由配置现有一个需求就是实现管理系统的版本发版&#xff0c;网页实现自动刷新页面获取最新版本 搜索了一下&#xff0c;轮询的方案有点浪费…

Mysql:避免重复的插入数据方法汇总

最常见的方式就是为字段设置主键或唯一索引&#xff0c;当插入重复数据时&#xff0c;抛出错误&#xff0c;程序终止&#xff0c;但这会给后续处理带来麻烦&#xff0c;因此需要对插入语句做特殊处理&#xff0c;尽量避开或忽略异常&#xff0c;下面我介绍4种方法&#xff1a; …

【Windows10】电脑副屏无法调节屏幕亮度?解决方法

先说下情况&#xff0c;本人对显示器不太懂&#xff0c;属于小白 这个副屏无法调节的问题出现也已经很久了&#xff0c;但是之前亮度适合就无所谓&#xff0c;今天突然按了之后很亮&#xff0c;于是就找问题。 第一步&#xff0c;我直接百度&#xff0c;遇事不决&#xff0c;百…

59 双向循环神经网络【动手学深度学习v2】

59 双向循环神经网络【动手学深度学习v2】 深度学习学习笔记 学习视频&#xff1a;https://www.bilibili.com/video/BV12X4y1c71W/?spm_id_fromautoNext&vd_source75dce036dc8244310435eaf03de4e330 核心思想&#xff1a;取决于过去和未来的上下文&#xff0c;来预测当前的…

Apache Spark 命令注入(CVE-2022-33891)

利用范围 Spark Core - Apache <3.0.3 3.1.1 < Spark Core - Apache <3.1.2 3.2.0 < Spark Core - Apache <3.2.1 环境搭建 修改bin目录下的spark-shell 修改如下&#xff0c;添加调试端口 变动如上 然后启动 ./spark-shell --conf spark.acls.enabletrue即…

使用百度地图官方WEB API,提示 “ APP 服务被禁用“ 问题的解决方法

问题描述 项目上用了百度地图官方WEB API&#xff0c;打开界面时百度地图无法打开&#xff0c;出现弹窗&#xff1a; APP被您禁用啦。详情查看&#xff1a;http://lbsyun.baidu.com/apiconsole/key#。 原因分析&#xff1a; 查看错误信息&#xff1a;"status":240,…

Word文档带有权限密码怎么办?

Word文档的权限密码指的是什么&#xff1f;其实这是Word文档的保护方法之一&#xff0c;具体指Word文档的编辑、修改受到了限制&#xff0c;需要输入密码才能进行。 设置了权限密码的Word文档还是可以直接打开&#xff0c;只有当需要编辑或者修改内容的时候&#xff0c;才会发…

CSDN版的详细MarkDown的使用教程

MarkDown的使用欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题&#xff0c;有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释…

雅思经验(7)

我发现雅思阅读要命的不是难度&#xff0c;而是时间的把控。考试时间是总共一小时&#xff0c;但是要写三篇文章&#xff0c;之后总共40道题目&#xff0c;也就是说每篇文章平均是13.3道。但是他们很多人说&#xff0c;如果誊写答案需要花掉3、4分钟每篇&#xff0c;也就是说真…

学习IB课程的宝藏网站,有需求选择

很多学习IB课程的同学都会觉得IB课程很难&#xff0c;平时作业很多根本没时间找资料&#xff0c;其实不用担心&#xff0c;关于IB课程学习的网站&#xff0c;小编已经帮大家整理好了&#xff0c;建议收藏起来&#xff01; 数学类IB网站&#xff1a;Revision Villag 数学对于会的…

Bard AI:训练过程中使用了多少数据?

近年来&#xff0c;人工智能取得了长足的进步&#xff0c;并在科技界掀起了波澜。 随着谷歌最近推出新的人工智能聊天机器人 Bard&#xff0c;人们对这项技术的工作原理以及训练它的内容感到好奇。 人工智能技术的关键组成部分之一是训练过程中使用的数据量&#xff0c;这有助于…

聊聊数据仓库是什么

随着数据通过各种方式创造了巨大价值&#xff0c;各领域的企业开始不断挖掘数据的作用&#xff0c;数据的重要性得到了社会各界的共同认可。像我们熟知的数据治理、数据管理、数据标准以及数据资产都是因为数据地位不断提升&#xff0c;企业开始重视起数据全生命周期流程&#…