后端:Layui实现文件上传功能

后端:Layui实现文件上传功能



后端:Layui实现文件上传功能

今天给大家分享采用AspNet MVC+前端框架LayUi实现文件上传功能,感兴趣的朋友可以学习一下。

文件上传实体(UploadFile.cs)

 public class UploadFile {        public int code { getset; }   //请求code        public string msg { getset; } // 请求消息        public string src { getset; } //文件路径        public string filename { getset; } //原始文件名 }

前端代码(Upload.cshtml):

@{ Layout = null;}<!DOCTYPE html><html><head> <meta name="viewport" content="width=device-width" /> <title>文件上传示例</title> <link href="~/Content/lib/layui/css/layui.css"  rel="stylesheet" /> <link href="~/Content/css/common.css" rel="stylesheet" /> <script src="~/Content/lib/layui/layui.js"></script></head><body> <div> <div class="layui-input-inline layui-btn-container"  style="width: auto;"> <button type="button"  class="layui-btn layui-btn-primary" id="btnUpload"> <i class="layui-icon">&#xe67c;</i>上传附件 </button> <div id="layer-photos-demo" class="fr"> <img id="imgPhoto" style="height:100px;width:100px;" src="" alt="">            </div> </div>        <div> <table class="layui-table"> <colgroup> <col width="150">                    <col width="200"> </colgroup> <thead> <tr> <th>文件名称</th>                        <th>操作</th> </tr> </thead> <tbody id="uploadList"></tbody> </table> </div> </div> <script type="text/javascript"> layui.use(["upload"], function () {
var upload = layui.upload; var $ = layui.$; upload.render({ elem: '#btnUpload', url: '/Upload/UploadFile',                size: '2048',//文件大小2M                exts: 'png|gif|jpg|jpeg|zip|rar',//文件扩展名 done: function (res) {                    if (res.code == 0) { $("#imgPhoto").attr("src", res.src); $("#uploadList").append("<tr><td>" + res.filename + "</td><td><a target='_blank' href='" + res.src + "'>查看</a></td><tr>"); } } });
});</script></body></html>

控制器代码(UploadController.cs

 // 上传视图 public ActionResult Upload(){ return View(); } // 上传逻辑public JsonResult UploadFile() { UploadFile uploadFile = new UploadFile(); try { var file = Request.Files[0]; //获取选中文件 var filecombin = file.FileName.Split('.'); if (file == null || string.IsNullOrEmpty( file.FileName) || file.ContentLength == 0 || filecombin.Length < 2) { uploadFile.code = -1; uploadFile.src = ""; uploadFile.msg = "上传失败!请检查文件"; return Json(uploadFile,  JsonRequestBehavior.AllowGet); } //定义本地路径位置 string localPath = Server.MapPath("~/Upload"); string filePathName = string.Empty; //最终文件名 string dateStr = DateTime.Now. ToString("yyyyMMddHHmmss"); filePathName = dateStr + "." + filecombin[1]; //Upload不存在则创建文件夹 if (!System.IO.Directory.Exists(localPath)) { System.IO.Directory.CreateDirectory(localPath); } //保存图片 file.SaveAs(Path.Combine(localPath, filePathName)); uploadFile.code = 0;
uploadFile.filename = filecombin[1]; uploadFile.src = Path.Combine("/Upload/", filePathName); uploadFile.msg = "上传成功"; return Json(uploadFile, JsonRequestBehavior.AllowGet); } catch (Exception) { uploadFile.code = -1; uploadFile.src = ""; uploadFile.msg = "上传失败!"; return Json(uploadFile, JsonRequestBehavior.AllowGet); } }

IT技术分享社区

后端:Layui实现文件上传功能


文章推荐
程序员效率:画流程图常用的工具
程序员效率:整理常用的在线笔记软件
远程办公:常用的远程协助软件,你都知道吗?
51单片机程序下载、ISP及串口基础知识
硬件:断路器、接触器、继电器基础知识


版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/2501.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • SPI 协议详解_cifs协议

    SPI 协议详解_cifs协议SPI协议详解1、SPI简介2、SPI四线3、SPI四种工作模式4、SPI时序图1、SPI简介SPI全称是SerialPerripheralInterface,也就是串行外围设备接口。SPI是Motorola公司推出的一种同步串行接口技术,是一种高速、全双工的同步通信总线,SPI时钟频率相比I2C要高很多,最高可以工作在上百MHz。SPI以主从方式工作,通常是有一个主设备和一个或多个从设备,一般SPI需要4根线,但是也可以使用三根线(单向传输)2、SPI四线

    2022年10月15日
  • OpenSSL密码库算法笔记——第5.2章 椭圆曲线算法的函数架构图

    OpenSSL密码库算法笔记——第5.2章 椭圆曲线算法的函数架构图椭圆曲线算法中涉及的函数纷繁复杂,比如为了实现“复制点群”功能,就定义了四个函数,有:intEC_GROUP_copy(EC_GROUP*dest,constEC_GROUP*src)、intec_GFp_mont_group_copy(EC_GROUP*dest,constEC_GROUP*src)、intec_GFp_simple_group_copy(…

  • siamfc模型训练_卷积神经网络分类

    siamfc模型训练_卷积神经网络分类Abstract本论文提出一种新的全卷积孪生网络作为基本的跟踪算法,这个网络在ILSVRC15的目标跟踪视频数据集上进行端到端的训练。我们的跟踪器在帧率上超过了实时性要求,尽管它非常简单,但在多个benchmark上达到最优的性能。1.Introduction最近很多研究通过使用预训练模型来解决上述问题。这些方法中,要么使用网络内部某一层作为特征的shallow方法(如相关滤波);要…

  • Fiddler抓取视频数据「建议收藏」

    准备工作:(1)、手机(安卓、ios都可以)/安卓模拟器,今天主要以安卓模拟器为主,操作过程一致。(2)、抓包工具:Fiddel下载地址:(https://www.telerik.com/download/fiddler)(3)、编程工具:pycharm(4)、安卓模拟器上安装抖音(逍遥安装模拟器)一、fiddler配置在tools中的options中,按照图中勾选后点击Actio…

  • 【java并发编程】底层原理——用户态和内核态的区别

    【java并发编程】底层原理——用户态和内核态的区别一、背景–线程状态切换的代价java的线程是映射到操作系统原生线程之上的,如果要阻塞或唤醒一个线程就需要操作系统介入,需要在户态与核心态之间切换,这种切换会消耗大量的系统资源,因为用户态与内核态都有各自专用的内存空间,专用的寄存器等,用户态切换至内核态需要传递给许多变量、参数给内核,内核也需要保护好用户态在切换时的一些寄存器值、变量等,以便内核态调用结束后切换回用户态继续工作。synch…

  • 英语网址大全_英语浏览器网址

    英语网址大全_英语浏览器网址英语网址大全转载自猫扑(mop.com)翻译http://www.bilinguist.com/汉英论坛,高手云集http://www.chinatranslate.net/中国翻译网,号称全国最大的翻译专业网站http://gb.transea.com/机器即时翻译,适合整体翻译网站及段落,但不够准确。适合一般人http://www.si-china.net自由翻译者冯

    2022年10月22日

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号