缩略图:比喻一张图片宽度为1000px,大小为800K,经过缩略后变成一张宽度100px,大小10K的图片。

先给出界面:

总体的流程分5步如下图：

1.添加一个html:GetminPic.html

代码:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

</head>

<body>

    <form action="Getmin.ashx" method="post" enctype="multipart/form-data">

        图片:<input type="file" name="file" id="file" onchange="javascript:fileInfo();" />

        <p style="font-size:12px;">原图宽:<label id="ow"></label>&nbsp;原图高:<label id="oh"></label>&nbsp;

            原图大小:<label id="os"></label>KB</p>

      <p>设置宽度:<input type="text" name="width" style="width:50px;"/>

          <span style="color:#09a02c;font-size:12px">高度按原图比例折算</span></p>

       <p><input type="submit" style="color:#ff6a00" value="下载缩略图" /> </p>

    </form>

</body>

</html>

 <script type="text/javascript">

     //上传前获取图片信息(用html5的File)

     function fileInfo() {

         var f = document.getElementById("file").files[];

         var reader = new FileReader();

         reader.readAsDataURL(f);

         reader.onload = function (e) {

             var data = e.target.result;

             //加载一个图片获取宽度高度

             var image = new Image();

             image.src = data;

             image.onload = function () {

                 var width = image.width;

                 var height = image.height;

                 var size = parseInt(f.size / );

                 document.getElementById("ow").innerHTML = width;

                 document.getElementById("oh").innerHTML = height;

                 document.getElementById("os").innerHTML = size;

             };

         }

     }

    </script>

2.添加一个一般处理程序:Getmin.ashx

代码:

 public void ProcessRequest(HttpContext context)

        {

            //1.获取用户上传的文件流

            HttpPostedFile file = context.Request.Files[];

            //获取文件名

            string fileName = file.FileName;

            //获取扩展名

            string Extension = Path.GetExtension(fileName).ToUpper();

            //2.根据用户上传的文件流创建一个图片

            using (Image originalImage = Image.FromStream(file.InputStream))

            {

            //获取原始图片的宽和高

                int owidth = originalImage.Width;

                int oheight = originalImage.Height;

                //缩略图的宽

                int mwidth = Convert.ToInt32(context.Request.Form["width"]);

                //等比例的高,取整数

                int mheight = mwidth * oheight / owidth;

                //3.根据原始图片，等比例创建一个缩小后的图片

                using (Image minImage = new Bitmap(mwidth, mheight))

                {

                   //4.把大图片内容画到小图片上

                    //基于小图创建一个画布对象

                    Graphics gmin = Graphics.FromImage(minImage);

                    //把大图画到小图上

                    gmin.DrawImage(originalImage, , , mwidth, mheight);

                    //5.下载缩略图

                    MemoryStream ms = new MemoryStream();

                    //判断图片类型

                    ImageFormat imageFormat = null;

                    string ContentType = "";

                    switch (Extension)

                    {

                        case ".JPG": imageFormat = ImageFormat.Jpeg; ContentType = "image/jpeg"; break;

                        case ".PNG": imageFormat = ImageFormat.Png; ContentType = "image/png"; break;

                        case ".GIF": imageFormat = ImageFormat.Gif; ContentType = "image/gif"; break;

                        //................如需要其他图片格式继续添加

                    }

                    minImage.Save(ms,imageFormat);

                    context.Response.ClearContent();

                    context.Response.AddHeader("Content-Disposition", "attachment;  filename=" + HttpUtility.UrlEncode(fileName, System.Text.Encoding.UTF8));

                    context.Response.ContentType=ContentType;

                    context.Response.BinaryWrite(ms.ToArray());

                    context.Response.End();

                }

            }

        }

        public bool IsReusable

        {

            get

            {

                return false;

            }

        }

代码注释已经很清晰了，所以也不一一解析了。

3.效果

 3.1挑一张计算机里的图片:

3.2上传前:

3.3把宽度设成200后点击下载

3.4查看已经下载的文件

demo下载:http://pan.baidu.com/s/1jHiIXuQ  提取密码:fewx

.NET生成缩略图并下载的更多相关文章

  1. 使用Uploadify实现上传图片生成缩略图例子,实时显示进度条

    不了解Uploadify的,先看看前一篇详细说明 http://www.cnblogs.com/XuebinDing/archive/2012/04/26/2470995.html Uploadify ...

  2. Java生成缩略图Thumbnailator(转载)

    转自(http://rensanning.iteye.com/blog/1545708) Thumbnailator 是一个为Java界面更流畅的缩略图生成库.从API提供现有的图像文件和图像对象的缩 ...

  3. php 使用 ffmpeg 转换视频，截图，并生成缩略图

    http://blog.csdn.net/toss156/article/details/7003059 把ffmpeg 和  生成缩略图整合了一下. include("ImageResiz ...

  4. openresty + lua-resty-weedfs + weedfs + graphicsmagick动态生成缩略图（类似淘宝方案）

    openresty + lua-resty-weedfs + weedfs + graphicsmagick动态生成缩略图(类似淘宝方案) --大部分的网站都要涉及到图片缩略图的处理,比如新闻配图,电 ...

  5. [转]Phantomjs实现获取网页快照并生成缩略图

    Shell脚本实现获取网页快照并生成缩略图 这篇文章主要介绍了Shell脚本实现获取网页快照并生成缩略图,本文获取网页快照使用phantomjs.生成缩略图使用ImageMagick,需要的朋友可以参 ...

  6. java图片裁剪和java生成缩略图

    一.缩略图 在浏览相冊的时候.可能须要生成相应的缩略图. 直接上代码: public class ImageUtil { private Logger log = LoggerFactory.getL ...

  7. 如何安装nginx_lua_module模块，升级nginx，nginx-lua-fastdfs-GraphicsMagick动态生成缩略图，实现图片自动裁剪缩放

    如何安装nginx_lua_module模块,升级nginx,nginx-lua-fastdfs-GraphicsMagick动态生成缩略图,实现图片自动裁剪缩放 参考网站:nginx-lua-fas ...

  8. 使用nginx生成缩略图

    nginx中可以使用 --with-http_image_filter_module 这个模块,今天发现在github上发现国人开发的一款模块 模块同时支持 Nginx 和 tengine 本ngin ...

  9. fastdfs+nginx+image_filter安装与生成缩略图

    fastdfs简介 类似google FS的一个轻量级分布式文件系统,纯C实现,支持linux.FreeBSD等UNIX系统: 只能通过API访问,不支持POXIS: 文件不分块存储,上传的文件和OS ...

随机推荐

  1. jQuery中position()与offset()区别

    使用jQuery获取元素位置时,我们会使用position()或offset()方法,两个方法都返回一个包含两个属性的对象-左边距和上边距,它们两个的不同点在于位置的相对点不同. 可以看看下边的图: ...

  2. 【译】在 Chrome 开发者工具中调试 node.js

    原文链接 : Debugging Node.js in Chrome DevTools 原文作者 : MATT DESLAURIERS 译文出自 : 掘金翻译计划 译文链接 : https://git ...

  3. IT部门能力评估...

    IT运行成本和变化成本越来越高,IT部门是否上了一些对企业无价值的系统,是否充分利用了已有系统的价值? 随 着IT应用不断深入,庞大的企业IT系统日积月累,各种隐患渐渐显露.IT系统变得越来越复杂,运 ...

  4. R语言之词云：wordcloud&wordcloud2安装及参数说明

    一.wordcloud安装说明 install.packages("wordcloud"); 二.wordcloud2安装说明 install.packages("dev ...

  5. Android xml 格式 随笔

    打包的时候Android xml文件会由字符格式(utf-8编码)转换为二进制格式.具体如:http://blog.csdn.net/jiangwei0910410003/article/detail ...

  6. 在 远程桌面 权限不足无法控制 UAC 提示时，可使用 计划任务 绕开系统的 UAC 提示

    就是记录一下,在远程的时候,很可能远程软件没有以管理员身份运行,或者其它原因,操作会被系统阻止,UAC 会进行提示,但是远程软件目前是无法操作的.(以下方法在 Windows 7 中测试通过) 可以通 ...

  7. WebStorm11 注册

    WebStorm11 注册 http://2.idea.lanyus.com/

  8. Android TabActivity中onKeyDown无效问题

    @Override     public boolean onKeyDown(int keyCode, KeyEvent event)     {                  //按下键盘上返回 ...

  9. Linux下php5.3编译oracle客户端

    因项目需要在linux下进行php5.3的oracle客户端编译,简要介绍一下步骤及走过的弯路. 1.下载Oracle客户端程序包,其中包含OCI.OCCI和JDBC-OCI等相关文件. 1.1下载文 ...

  10. SAP GUI SAPLOGON.INI

    GUI是SAP系统最常用的客户端,在一台客户机上,利用GUI可以连接多套SAP系统(连接方法参见<客户端连接配置(SAP GUI 710)>),也可以设置多个快捷方式登录(参见<用快 ...