简单图片上传功能
目标:实现从本地磁盘读取图片文件,展示到浏览器页面。
步骤:
(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. [转]为什么复制构造函数的参数需要加const和引用

    [转]为什么复制构造函数的参数需要加const和引用 一.引言 1.0在解答这个问题之前,我们先跑个小程序,看下调用关系. #include <iostream> using namesp ...

  2. 新手必看!Office Web Apps 2013 安装与配置(实战)

    分享人:广州华软 星尘 一. 前言 Office Web Apps Server 是Office 服务器产品,它可提供在Sharepoint 2013网站中在线浏览和编辑 Word.PowerPoin ...

  3. 首发福利!全球第一开源ERP Odoo系统架构部署指南 电子书分享

    引言 Odoo,以前叫OpenERP,是比利时Odoo S.A.公司开发的一个企业应用软件套件,开源套件包括一个企业应用快速开发平台,以及几千个Odoo及第三方开发的企业应用模块.Odoo适用于各种规 ...

  4. WinForm DataGridView双向数据绑定

    程序目标: 实现DataGridView与BindingList<T>双向绑定.用户通过DataGridView修改值后立即更新BindList对象的值,代码修改BindList后立即更新 ...

  5. LeetCode算法题-Toeplitz Matrix(Java实现)

    这是悦乐书的第312次更新,第333篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第181题(顺位题号是766).如果从左上角到右下角的每个对角线具有相同的元素,则矩阵是 ...

  6. kodi18.1设置中文的方法

    默认情况下,新安装好的 Kodi 启动后是英文版的界面.但事实上,Kodi 包含多国语言 (包含简繁体中文版),我们可以设置改回简体中文界面.不过,很多人都遇到修改 Kodi 的语言为中文之后整个界面 ...

  7. cmake 入门实战

    当你的程序只有一个源文件时,直接就可以用gcc命令编译它 g++ main.cc 这样会输出一个main.out https://www.hahack.com/codes/cmake/

  8. 百度APP移动端网络深度优化实践分享(一):DNS优化篇

    本文由百度技术团队“蔡锐”原创发表于“百度App技术”公众号,原题为<百度App网络深度优化系列<一>DNS优化>,感谢原作者的无私分享. 一.前言 网络优化是客户端几大技术方 ...

  9. 新更新kb4493472导致无法正常开机

    昨天陆续接到电话,说是系统更新后电脑不能正常使用,症状基本是开机到欢迎界面就出现各种各样的状况,比如鼠标能动,其他无反应;欢迎界面结束后黑屏,只有鼠标能动:开机后正常,但电脑使用很卡等等状况.因为昨天 ...

  10. 解决 HomeBrew 下载缓慢的问题

    macOS 自身不提供包管理器,常用的包管理器有 HomeBrew MacPorts MacPorts 第一次使用要 build 整个基本库,编译时间很长.优点是不怎么依赖系统,更新 macOS 不会 ...