C# ASP.NET MVC 图片上传的多种方式(存储至服务器文件夹,阿里云oss)

图片上传时我们进场用到的一个功能今天将他整理了一下写了个demo希望对大家有用

该demo分为如下

1.上传至至服务器文件夹

2.上传至阿里云oss

3.百度webupload上传图片

效果图如下:

首先讲解一下后台代码

(1)上传至服务器存储

using System;
using System.Collections;
using System.Collections.Generic;
using System.Globalization;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace ImageUpLoad.Controllers
{public class UpLoadController : Controller{//定义存储文件夹private string SavePath{get{return "/Register/";}}#region uploadJsonpublic ActionResult NewUploadImg(){//文件保存目录URLvar saveUrl = SavePath;//定义允许上传的文件扩展名var extTable = new Hashtable{{"image", "gif,jpg,jpeg,png,bmp"}};//最大文件大小const int maxSize = 4194304;var imgFile = Request.Files[0];//HttpPostedFile imgFile = context.Request.Files["imgFile"];if (imgFile == null){return NewShowError("请选择文件。", true);}var dirPath = Server.MapPath(SavePath);if (!Directory.Exists(dirPath)){//return ShowError("上传目录不存在。" + dirPath);Directory.CreateDirectory(dirPath);}var dirName = Request.QueryString["dir"];if (String.IsNullOrEmpty(dirName)){dirName = "image";}if (!extTable.ContainsKey(dirName)){return NewShowError("目录名不正确。", true);}var fileName = imgFile.FileName;var extension = Path.GetExtension(fileName);if (extension == null){return NewShowError("extension == null", true);}var fileExt = extension.ToLower();if (imgFile.InputStream == null || imgFile.InputStream.Length > maxSize){return NewShowError("上传文件大小超过限制。", true);}if (String.IsNullOrEmpty(fileExt) ||Array.IndexOf(((String)extTable[dirName]).Split(','), fileExt.Substring(1).ToLower()) == -1){return NewShowError("上传文件扩展名是不允许的扩展名。\n只允许" + ((String)extTable[dirName]) + "格式。", true);}//创建文件夹dirPath += dirName + "/";saveUrl += dirName + "/";if (!Directory.Exists(dirPath)){Directory.CreateDirectory(dirPath);}var ymd = DateTime.Now.ToString("yyyyMMdd", DateTimeFormatInfo.InvariantInfo);dirPath += ymd + "/";saveUrl += ymd + "/";if (!Directory.Exists(dirPath)){Directory.CreateDirectory(dirPath);}var newFileName = DateTime.Now.ToString("HHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt;var filePath = dirPath + newFileName;imgFile.SaveAs(filePath);var fileUrl = saveUrl + newFileName;var hash = new Hashtable();return NewShowError(fileUrl, true);}private JsonResult NewShowError(string message, bool isImg){var hash = new Hashtable();hash["mess"] = message;hash["isImg"] = isImg;return Json(hash, "text/html;charset=UTF-8");}#endregion//删除文件public ActionResult DeleteImg(string fileSrc){var dirPath = Server.MapPath(fileSrc);if (System.IO.File.Exists(dirPath)){System.IO.File.Delete(dirPath);}return Json("");}}
}

(2)上传至oss服务器

using Aliyun.OSS;
using Aliyun.OSS.Common;
using System;
using System.Collections;
using System.Collections.Generic;
using System.Globalization;
using System.IO;
using System.Linq;
using System.Security.Cryptography;
using System.Threading;
using System.Web;
using System.Web.Mvc;namespace ImageUpLoad.Controllers
{public class NetUpLoadController : Controller{static string bucketName = Config.bucketName;//oss bucketNamestatic string accessKeyId = Config.AccessKeyId;//阿里云 aceesskeyidstatic string accessKeySecret = Config.AccessKeySecret;//阿里云 AccessKeySecretstatic string endpoint = Config.Endpoint;//oss Endpointstatic OssClient client = new OssClient(endpoint, accessKeyId, accessKeySecret);static AutoResetEvent _event = new AutoResetEvent(false);static HashAlgorithm hashAlgorithm = new MD5CryptoServiceProvider();#region uploadJsonpublic ActionResult NewUploadImg(){string time = DateTime.Now.ToString("yyyy-MM-dd");string NewsavePath = "Register/";//文件保存目录URLvar saveUrl = NewsavePath;//定义允许上传的文件扩展名var extTable = new Hashtable{{"image", "gif,jpg,jpeg,png,bmp,pdf"}};//最大文件大小const int maxSize = 15728640;var imgFile = Request.Files[0];if (imgFile == null){return NewShowError("请上传出错,选择文件。", true);}var dirName = Request.QueryString["dir"];if (String.IsNullOrEmpty(dirName)){dirName = "image";}if (!extTable.ContainsKey(dirName)){return NewShowError("上传出错,目录名不正确。", true);}var fileName = imgFile.FileName;var extension = Path.GetExtension(fileName);if (extension == null){return NewShowError("上传出错,extension == null", true);}var fileExt = extension.ToLower();if (imgFile.InputStream == null || imgFile.InputStream.Length > maxSize){return NewShowError("上传出错,上传文件大小超过限制。", true);}if (String.IsNullOrEmpty(fileExt) ||Array.IndexOf(((String)extTable[dirName]).Split(','), fileExt.Substring(1).ToLower()) == -1){return NewShowError("上传出错,上传文件扩展名是不允许的扩展名。\n只允许" + ((String)extTable[dirName]) + "格式。", false);}//创建文件夹saveUrl += dirName + "/";var ymd = DateTime.Now.ToString("yyyyMMdd", DateTimeFormatInfo.InvariantInfo);saveUrl += ymd + "/";var newFileName = DateTime.Now.ToString("HHmmssffff", DateTimeFormatInfo.InvariantInfo) + fileExt;var filePath = saveUrl + newFileName;var fileUrl = "/" + saveUrl + newFileName;var hash = new Hashtable();try{client.PutObject(bucketName, filePath, imgFile.InputStream);//由于我的域名地址是oss前缀是https://quicktouch.oss-cn-beijing.aliyuncs.com//这里返回前台的时候加上去return NewShowError("https://quicktouch.oss-cn-beijing.aliyuncs.com"+fileUrl, true);}catch (OssException ex){hash["error"] = 1;hash["url"] = ex.Message;return NewShowError("上传出错," + ex.Message, true);}catch (Exception ex){hash["error"] = 1;hash["url"] = ex.Message;return NewShowError("上传出错," + ex.Message, true);}}private JsonResult NewShowError(string message, bool isImg){var hash = new Hashtable();hash["mess"] = message;hash["isImg"] = isImg;return Json(hash, "text/html;charset=UTF-8");}#endregionpublic ActionResult DeleteImg(string fileSrc){try{   //去除图片地址中前缀int size = "https://quicktouch.oss-cn-beijing.aliyuncs.com/".Length;fileSrc = fileSrc.Substring(size, fileSrc.Length - size);client.DeleteObject(bucketName, fileSrc);//hash["error"] = 0;//hash["url"] = SiteURL + fileUrl;}catch (OssException ex){}catch (Exception ex){}return Json("");}}
}

(3)前端webupload代码

$('#upload-container').click(function (event) {$("#picker").find('input').click();
});
var uploader = WebUploader.create({auto: true,// 选完文件后,是否自动上传。swf: 'https://cdn.bootcss.com/webuploader/0.1.1/Uploader.swf',// swf文件路径server: '/UpLoad/NewUploadImg',// 文件接收服务端。dnd: '#upload-container',pick: '#picker',// 内部根据当前运行是创建,可能是input元素,也可能是flash. 这里是div的idmultiple: true, // 选择多个chunked: true,// 开起分片上传。threads: 1, // 上传并发数。允许同时最大上传进程数。method: 'POST', // 文件上传方式,POST或者GET。fileSizeLimit: 1024 * 1024 * 100 * 100, //验证文件总大小是否超出限制, 超出则不允许加入队列。fileSingleSizeLimit: 1024 * 1024 * 100, //验证单个文件大小是否超出限制, 超出则不允许加入队列。fileVal: 'upload', // [默认值:'file'] 设置文件上传域的name。
});uploader.on('fileQueued', function (file) {// 选中文件时要做的事情,比如在页面中显示选中的文件并添加到文件列表,获取文件的大小,文件类型等console.log(file.ext) // 获取文件的后缀console.log(file.size) // 获取文件的大小console.log(file.name);var html = '<div class="upload-item" id="upload_' + file.id + '" style="text-align:center"><img src="" id="img_' + file.id + '" style="width:50px;width:50px;"><br><input type="hidden" id="' + file.id + '"><span>文件名:' + file.name + '</span><span data-file_id="' + file.id + '" class="btn-delete">删除</span><span data-file_id="' + file.id + '" class="btn-retry">重试</span><div class="percentage ' + file.id + '" style="width: 0%;"></div></div>';$('#upload-list').append(html);
});uploader.on('uploadProgress', function (file, percentage) {console.log(percentage * 100 + '%');var width = $('.upload-item').width();$('.' + file.id).width(width * percentage);
});uploader.on('uploadSuccess', function (file, response) {console.log(file.id + "传输成功");$("#" + file.id).val(response.mess);$("#img_" + file.id).attr('src', response.mess);});uploader.on('uploadError', function (file) {console.log(file);console.log(file.id + 'upload error')
});$('#upload-list').on('click', '.upload-item .btn-delete', function () {// 从文件队列中删除某个文件idfile_id = $(this).data('file_id');// uploader.removeFile(file_id); // 标记文件状态为已取消uploader.removeFile(file_id, true); // 从queue中删除var urlsrc = $("#" + file_id).val();$.ajax({url: '/UpLoad/DeleteImg',//地址type: 'Post',//类型data: { fileSrc: urlsrc },timeout: 2000,//超时//请求成功success: function (data, status) {//alert(status);},//失败/超时error: function (XMLHttpRequest, textStatus, errorThrown) {alert('删除失败');//alert(errorThrown);}})$("#upload_" + file_id).remove();alert("删除成功");
});$('#upload-list').on('click', '.btn-retry', function () {uploader.retry($(this).data('file_id'));
});uploader.on('uploadComplete', function (file) {console.log(uploader.getFiles());
});

注意我这里阿里云oss的读写方式是如果为私有的话需要加上读取时候的验证

 public ActionResult GetSignedUrl(string Imgurl){string restr = "";try{OssClient client = new OssClient(endpoint, accessKeyId, accessKeySecret);var request = new GeneratePresignedUriRequest(bucketName, Imgurl, SignHttpMethod.Get);//方式request.Expiration = DateTime.Now.AddMinutes(60);//有限时间var signedUrl = client.GeneratePresignedUri(request);restr = signedUrl.ToString();return Json(new { result = 1, data = restr, msg = "" }, JsonRequestBehavior.AllowGet);//return restr;}catch (Exception ex){return Json(new { result = 0, data = "", msg = ex.Message }, JsonRequestBehavior.AllowGet);}}

这里需要注意的是如果为公共读的话我input值取的是完整url地址去存数据库

而私有读的话我只取了阿里云的文件地址并没有加上域名,因为私有的你要通过存储的文件地址去加上key和有效时间才能访问图片

下载地址

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

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

相关文章

java变量命名规则_浅谈JAVA开发规范与开发细节(上)

开发团队在开发过程中&#xff0c;由于每个人的开发习惯&#xff0c;以及对于技术的理解深浅程度不一&#xff0c;往往一个项目在开发过程中&#xff0c;代码的质量&#xff0c;代码的风格都不尽相似&#xff0c;所以有一份适合团队的代码规范是非常有必要的&#xff0c;而一个…

Charles

安装 https://www.jianshu.com/p/cb744a4c0344 https://blog.csdn.net/qq_28831197/article/details/81196571 使用说明&#xff1a; 来源&#xff1a;https://www.jianshu.com/p/73b134559c76 过滤网络请求 通常情况下&#xff0c;我们需要对网络请求进行过滤&#xff0c;只监…

.NET Core Docker使用初入篇

本篇内容如何在CentOS上安装Docker服务器与工具准备安装Docker更新系统安装Docker源设置Docker开机启动启动Docker使用Docker运行一个.NET Core 例子.net core 例子拉取.net core 例子停止.net core 例子启用其他如何在CentOS上安装Docker 服务器与工具准备 首先我们需要一个…

如何延长作用域链_第4部分2:作用域(链)和 闭包

知识列表作用域/作用域链 闭包&#xff08;涉及JS垃圾回收机制 &#xff09;https://zhuanlan.zhihu.com/p/27110726 【 js 基础 】【读书笔记】作用域和闭包https://juejin.im/post/5afb0ae56fb9a07aa2138425 深入理解闭包之前置知识→作用域与词法作用域&#xff08;一&#…

C# T4模板在项目中的使用

1.什么是t4模版 T4&#xff0c;即4个T开头的英文字母组合&#xff1a;Text Template Transformation Toolkit。 T4(Text Template Transformation Toolkit)是微软官方在VisualStudio 2008中开始使用的代码生成引擎。在 Visual Studio 中&#xff0c;“T4 文本模板”是由一些文…

Docker中安装Jenkins实时发布.net core 项目(一)

Docker中安装Jenkins实时发布.net core 项目安装docker懒人篇手动安装dockerfile安装jenkins常规安装jenkinsjenkins的安装搜索jenkins拉取jenkins容器jenkins的启动jenkins密码其他安装docker 使用curl安装最新版 curl -fsSL https://get.docker.com/ | sh重启Docker systemc…

Docker中安装Jenkins实时发布.net core 项目(二)

Docker中安装Jenkins实时发布.net core 项目防坑点升级dockerjenkins运行运行命令jenkins拉取git并构建项目其他查看发布文件防坑点 升级docker 首先我们要确认我们在liunx安装的不是1.31.1的docker容器不然在后面的运行中会报错 can not open /etc/sysconfig/docker如果你是…

Jenkins构建 netcore5.0 项目时出现NU3028/NU3037错误的解决方案

我在使用Jenkins自动化部署项目的时候&#xff0c;出现了如下的错误 error NU3028: Package System.IO.Compression 4.3.0 from source https://api.nuget.org/v3/index.json: The repository primary signatures timestamp found a chain building issue: UntrustedRoot: self…

2019长安大学ACM校赛网络同步赛 L XOR

题意 求区间内有多少数x满足x^4x^5x0 1≤l≤r≤1018. 题解 根据异或的性质可以推到 x^4x5x -->x^4xx4x 即x和4x每一位都不同&#xff0c;即x和(x<<2)每一位都不同&#xff0c;就是x中每一位都与他前前一位不同。 那么就很简单了&#xff0c;可以很容易写出数位DP状态f…

贝塞尔曲线 总结

Bzier curve(贝塞尔曲线)是应用于二维图形应用程序的数学曲线。 曲线定义&#xff1a;起始点、终止点&#xff08;也称锚点&#xff09;、控制点。通过调整控制点&#xff0c;贝塞尔曲线的形状会发生变化。 1962年&#xff0c;法国数学家Pierre Bzier第一个研究了这种矢量绘制曲…

python变量标识符_简谈-Python的注释、变量类型、标识符及关键字

在Python程序中&#xff0c;要想支持中文输出&#xff0c;则要在代码前面添加标识符&#xff1a;开发人员在程序中自定义的一些符号和名称 标示符是自己定义的,如变量名 、函数名等 标识符的规则&#xff1a; 标示符由字目、下划线和数字组成&#xff0c;且数字不能开头 python…

win10使用docker desktop安装k8s一直starting解决方法

在docker中启动k8s一直卡在staring当中查了许多文档都写得不明不白的&#xff0c;研究了许久终于解决决定写个帖子来记录一下 1.首先查看本地docker中k8s的版本拉取源码 我们这里是1.19.7 然后我们进入到 k8s下载 去拉取k8s源码 git clone https://codechina.csdn.net/mirr…

Android菜单详解(三)——SubMenu和IconMenu

我们在上一篇介绍了如何在Android中创建和响应选项菜单&#xff0c;今天我们将探索子菜单和图标菜单。 子菜单Sub Menu 子菜单提供了一种自然的组织菜单项的方式&#xff0c;它被大量地运用在windows和其他OS的GUI设计中。Android同样支持子菜单&#xff0c;你可以通过addSubMe…

Liunx下使用Nginx负载均衡

我是centos8得主机 安装命令: yum install nginx 如果为Ubuntu主机 sudo apt-get install nginx 安装完成后&#xff0c;启用并启动Nginx服务&#xff1a; sudo systemctl enable nginxsudo systemctl start nginx 然后我们有2个服务&#xff1a; 一个地址为: http://xx…

如何给微软提反馈建议以及bug

1.相信各位在使用.net core的过程中多多少少遇到了bug和为解决的坑那么我们肿么联系微软反馈问题你 1.找到vs编辑器中的反馈按钮 2.点击进入网址 如果是vs的问题选择visual studio栏目,如果为编译问题或者其他问题请选择对应的栏目 然后写下你的问题和截图&#xff0c;尽量详…

windwos docker安装k8s一直staring的解决方法

今天遇到了一个很奇怪的问题 docker中启动k8s一直卡在starting 然后就不动了&#xff0c;找了很多解决方法终于得到解决这里把解决流程写在这里 1.配置镜像加速器 首先登录阿里云&#xff0c;阿里云有一个免费的镜像加速服务&#xff0c;可以加快拉取docker容器的速度这里一定…

对未标记为可安全执行的脚本_三、??XSS跨站脚本攻击

跨站脚本攻击(Cross Site Scripting)&#xff0c;缩写为XSS。恶意攻击者往Web页面里插入恶意Script代码&#xff0c;当用户浏览该页之时&#xff0c;嵌入其中Web里面的Script代码会被执行&#xff0c;从而达到恶意攻击用户的目的。理论上&#xff0c;所有可输入的地方没有对输入…

.net 使用阿里云RocketMQ

1.首先我们来讲解一下消息队列的作用 比如说我们的订单系统&#xff0c;再客户订单生成了以后&#xff0c;可能会有 快递系统&#xff0c;通知系统&#xff0c;和打印系统需要用到当前订单的详细内容 所以这个时候常规的操作是在A里面通过代码调用B&#xff0c;C &#xff…

tensorflow 目标分割_Tensorflow中的控制流和优化器

控制流只要对tensorflow有一点了解&#xff0c;都应该知道graph是tensorflow最基本的一个结构。Tensorflow的所有计算都是以图作为依据的。图的nodes表示一些基本的数学运算&#xff0c;比如加法&#xff0c;卷积&#xff0c;pool等。Node使用protoBuf来进行描述&#xff0c;包…

Reflector 已经out了,试试ILSpy

Reflector是.NET开发中必备的反编译工具。即使没有用在反编译领域&#xff0c;也常常用它来检查程序集的命名规范&#xff0c;命名空间是否合理&#xff0c;组织类型的方法是否需要改善。举例说明&#xff0c;它有一个可以查看程序集完整名称的功能&#xff0c;请看下图 这里的…