简单图片上传功能
目标:实现从本地磁盘读取图片文件,展示到浏览器页面。
步骤:
(1). 首先创建一个用于上传图片的HTML模板,命名为ImageUpload.html:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
</head>
<body>
<!--文件上传必须设置enctype="multipart/form-data"-->
<form method="post" enctype="multipart/form-data" action="ImageUpload.ashx">
<input type="file" name="imgFile" />
<input type="submit" value="上传"/>
</form>
</body>
</html>

模板中包含两个input标签,类型分别为“file”和“submit”,其中,form表单的method属性必须为“post”,enctype为“multipart/form-data”。

(2). 在ImageUpload.html模板中判断一下所上传的文件是否为图片:

<script src="../scripts/jquery-1.12.4.min.js"></script>
<!--如果监听到上传的文件的后缀不是图片,那就将file得到的内容设为空-->
<script type="text/javascript">
$(function () {
$(":file").change(function () {
var fileName = $(this).val();
var ext = fileName.substr(fileName.lastIndexOf('.'));
if (ext == ".jpeg" || ext == ".jpg" || ext == ".png" || ext == ".gif") {
return true;
} else {
$(this).val("");
}

});
});
</script>

(3). 新建一个名为ImageUpload.ashx的一般处理程序,为保证上传的文件是图片,需要在后台再次判断一下所传文件的格式(因为浏览器中可以改前台代码):

using System;
using System.IO;
using System.Web;

namespace ThreeLayerWebDemo.FileUpload
{
/// <summary>
/// ImageUpload 的摘要说明
/// </summary>
public class ImageUpload : IHttpHandler
{

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/html";
//context.Response.Write("Hello World");
//后台拿到上传来的图片(拿到名为imgFile的input标签的文件)
var file =context.Request.Files["imgFile"];

//后台也要对拿到的数据是否为图片进行校验(因为前台可以通过浏览器改代码,前台校验完了需要后台再拦截一下)
var ext= Path.GetExtension(file.FileName);
if (!(ext==".jpeg"||ext==".jpg"||ext==".png"||ext==".gif"))
{
context.Response.Write("shit,你传的不是图片");
context.Response.End();
}
else
{
//上传的文件保存到目录(为了保证文件名不重复,加个Guid)
string path = "/Upload/" + Guid.NewGuid().ToString() + file.FileName;
file.SaveAs(context.Request.MapPath(path));//必须得是相对路径

//把图片显示到前端让用户看得到
string str = string.Format("<html><head></head><body><img src='{0}'/></body></html>",
path);//必须得是绝对路径!!!!
context.Response.Write(str);
}

}

public bool IsReusable
{
get
{
return false;
}
}
}
}

ASP.NET学习笔记 —— 一般处理程序之图片上传的更多相关文章

  1. Android学习笔记进阶之在图片上涂鸦(能清屏)

    Android学习笔记进阶之在图片上涂鸦(能清屏) 2013-11-19 10:52 117人阅读 评论(0) 收藏 举报 HandWritingActivity.java package xiaos ...

  2. ASP.NET Core 简单实现七牛图片上传(FormData 和 Base64)

    ASP.NET Core 简单实现七牛图片上传(FormData 和 Base64) 七牛图片上传 SDK(.NET 版本):https://developer.qiniu.com/kodo/sdk/ ...

  3. Asp.net中FileUpload控件实现图片上传并带预览显示

    单一图片上传——“选择”+“上传”,.NET默认模式: 1.实现原理:     采用FileUpload控件默认的使用方式,先由“选择”按钮选择图片,然后单击“上传”按钮完成上传,并可在“上传”按钮的 ...

  4. Asp.net core 学习笔记 ( upload/download files 文件上传与下载 )

    更新 :  2018-01-22  之前漏掉了一个 image 优化, 就是 progressive jpg refer : http://techslides.com/demos/progressi ...

  5. 基于ASP.Net +easyUI框架上传图片,实现图片上传,提交表单

    <body> <link href="../../Easyui/themes/easyui.css" rel="stylesheet" typ ...

  6. Dynamic CRM 2013学习笔记(十三)附件上传 / 上传附件

    上传附件可能是CRM里比较常用的一个需求了,本文将介绍如何在CRM里实现附件的上传.显示及下载.包括以下几个步骤: 附件上传的web页面 附件显示及下载的附件实体 调用上传web页面的JS文件 实体上 ...

  7. java web 学习笔记 - jsp用的文件上传组件 SmartUpload

    ---恢复内容开始--- 1. SmartUpload 此控件在jsp中被广泛的使用,而FileUpload控件主要是用在框架中 2. 如果想要使用,需要在tomcat的lib目录中,将SmartUp ...

  8. ASP.NET MVC+Easyui 后台管理系统的图片上传

    实现图片的上传 easyui代码部分: //添加按钮 var URL; $("#btnCreate").click(function () { $('#UserDialog').d ...

  9. Beego 学习笔记11:文件的上传下载

    文件的上传和下载 1->文件的上传 文件的上传,采用的是uploadify.js这个插件. 本事例实现的是上传图片文件,其他的文件上传也一样. 2->文件的下载 文件的下载有两个实现的方式 ...

随机推荐

  1. Eclipse4JavaEE安装SpringBoot

    第一步:下载SpringBoot SpringBoot官网下载链接 第二步:在Eclipse里进行安装 打开Eclipse,菜单栏Help ->Install New Software,进入下图 ...

  2. 结合JDK源码看设计模式——迭代器模式

    前言: Iterator翻译过来就是迭代器的意思.在前面的工厂模式中就介绍过了iterator,不过当时介绍的是方法,现在从Iterator接口的设计来看,似乎又是一种设计模式,下面我们就来讲讲迭代器 ...

  3. vue 脚手架 立即可以写业务 vue + vue-router + less + axios + elementUI + moment

    https://github.com/cynthiawupore/wq-cli

  4. App瘦身、性能优化总结

    App瘦身 资源瘦身 使用tinypng压缩PNG图片.视频可以通过 Final cut等软件进行分辨率压缩.音频则降低码率即可. 非必须资源文件可以放到自己服务器上 启动图使用 LaunchScre ...

  5. Storm入门(七)可靠性机制代码示例

    一.关联代码 使用maven,代码如下. pom.xml  参考 http://www.cnblogs.com/hd3013779515/p/6970551.html MessageTopology. ...

  6. Python 爬虫——抖音App视频抓包

    APP抓包 前面我们了解了一些关于 Python 爬虫的知识,不过都是基于 PC 端浏览器网页中的内容进行爬取.现在手机 App 用的越来越多,而且很多也没有网页端,比如抖音就没有网页版,那么上面的视 ...

  7. [Swift]动态变化顶部状态栏(statusBar)的颜色

    顶部状态栏(statusBar)的两种样式: (1).default 样式:黑色. (2).light 样式:白色 一.无导航栏情况 如果没有使用导航控制器 UINavigationControlle ...

  8. Python爬虫入门教程 51-100 Python3爬虫通过m3u8文件下载ts视频-Python爬虫6操作

    什么是m3u8文件 M3U8文件是指UTF-8编码格式的M3U文件. M3U文件是记录了一个索引纯文本文件, 打开它时播放软件并不是播放它,而是根据它的索引找到对应的音视频文件的网络地址进行在线播放. ...

  9. Docker & ASP.NET Core (3):发布镜像

    第一篇:把代码连接到容器 第二篇:定制Docker镜像 上一篇文章最后有个问题,定制的镜像无法正常运行: 这可能是由于无法找到要运行的dll引起的问题. 之前的Dockerfile的文档我是按照微软的 ...

  10. Abp框架之执行Update-Database 命令系列错误

    废话不多说,直接开门见山.首先的 第一个错误:一般都是,碰到这个问题不要慌,先不要急着去查看sql服务是否开启,首先按F5启动项目,报错之后直接终止项目,然后再执行Update-Database命令 ...