.Net Html如何上传图片到一般应用程序
2018-06-22 07:43:11来源：未知 阅读 ()
html实现图片上传 后台采用.net其中在这里要借用一个js插件
在这里我会写一个图片上传的一个小Demo，有不全的地方多多包容,和提议，
我把已经写好的demo已经上传到百度云 在这里可以下载 https://pan.baidu.com/s/1qY2STh6
可以直接运行，Default.aspx是单张图片上传。Default2.aspx是多张图片上传，仿照的 http://fex.baidu.com/webuploader/demo.html
开始 html中的内容是
<body>
<div>
<div>
<img src="images/photo.jpg" id="user_head" width="140" height="140" />
<p>
图片格式：GIF、JPG、JPEG、PNG<br />
图片大小：最高不超过500K
</p>
<div id="uploader-demo">
<!--用来存放item-->
<div id="fileList" class="uploader-list"></div>
<div id="filePicker">选择图片</div>
</div>
</div>
</div>
</body>
其中在
<link href="js/webuploader-0.1.5/webuploader.css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script src="js/webuploader-0.1.5/webuploader.js"></script>
<script>
$(function () {
var uploader = WebUploader.create({
// 选完文件后，是否自动上传。
auto: true,
// swf文件路径
swf: 'js/webuploader-0.1.5/Uploader.swf',
// 文件接收服务端。
server: 'ashx/fileupload.ashx',
// 选择文件的按钮。可选。<a href="js/webuploader/server/fileupload.ashx">js/webuploader/server/fileupload.ashx</a>
// 内部根据当前运行是创建，可能是input元素，也可能是flash.
pick: '#filePicker',
// 只允许选择图片文件。
accept: {
title: 'Images',
extensions: 'gif,jpg,jpeg,png',
mimeTypes: 'image/gif,image/jpg,image/jpeg,image/png'
},
});
//上传成功触发事件
uploader.on('uploadSuccess', function (file, response) {
$("#user_head").attr("src", response.id);
});
//上传前触发事件
uploader.on( 'fileQueued', function( file ) {
uploader.options.formData = { src: $("#user_head").attr("src") == "images/photo.jpg" ? "" : $("#user_head").attr("src") };
})
})
</script>
这样图片请求就到了 ashx/fileupload.ashx一般处理程序
/// <summary>
/// 文件保存操作
/// </summary>
/// <param name="basePath"></param>
private void SaveFile(string basePath = "~/images/")
{
var name = string.Empty;
basePath = (basePath.IndexOf("~") > -1) ? System.Web.HttpContext.Current.Server.MapPath(basePath):basePath;//获取绝对路径
HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;
//如果目录不存在，则创建目录
if (!Directory.Exists(basePath))
{
Directory.CreateDirectory(basePath);
}
var suffix = files[0].ContentType.Split('/');
//获取文件格式
var _suffix = suffix[1];//suffix[1].Equals("jpeg", StringComparison.CurrentCultureIgnoreCase) ? "" :
var _temp = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo); //System.Web.HttpContext.Current.Request["name"];
//如果不修改文件名，则创建随机文件名
if (!string.IsNullOrEmpty(_temp))
{
name = _temp + "." + _suffix;
}
else
{
Random rand = new Random(24 * (int)DateTime.Now.Ticks);
name = rand.Next() + "." + _suffix;
}
//文件保存
var full = basePath + name;
files[0].SaveAs(full);
var _result = "{\"jsonrpc\" : \"2.0\", \"result\" : null, \"id\" : \"images/" + name + "\"}";
if (image != "")
{
//删除指定文件
string image_n = image.Split('/')[image.Split('/').Length - 1];
ImageDemo.Upload.Upload.DeleteFile(basePath, image_n);
}
//返回处理结果 -------结束
System.Web.HttpContext.Current.Response.Write(_result);
}
这个如果帮上了你的忙，可以为我点一下赞哦，
到这里就完成了图片上传，如果你们没有看懂的话可以留言，我将会全力帮助
jQuery File Upload 参考API: http://fex.baidu.com/webuploader/doc/
标签：
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有
- asp.net源程序编译为dll文件并调用的实现过程 2020-03-29
- Asp.net MVC SignalR来做实时Web聊天实例代码 2020-03-29
- ASP.NET MVC中jQuery与angularjs混合应用传参并绑定数据 2020-03-29
- Asp.Net中WebForm的生命周期 2020-03-29
- ASP.NET使用Ajax返回Json对象的方法 2020-03-23
IDC资讯： 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营： 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧： 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash
