2 wangyantao hb wangyantao_hb 于 2014.12.10 09:23 提问

asp.net 将大图压缩成小图片在首页上显示,为了加快显示速度

首页上显示图片,缩略图,图片在大图的基础上压缩成小图,然后在首页上显示

3个回答

showbo
showbo   Ds   Rxr 2014.12.10 10:04

用C#生成缩略图,同时保存大图。好多这种代码网上
http://blog.csdn.net/zxmcl/article/details/1722770
http://blog.csdn.net/jinbiao520/article/details/8973774

showbo
showbo 回复wangyantao_hb: 用System.IO空间下的(Directory.GetFiles获取所有文件然后遍历生成缩略图,建议你缩略图名称依据大图来定,这样就不需要更新数据库了。如打不为123456.jpg,小图就用123456_s.jpg,就是比大图多个_s,以后生成的缩略图也是这样,这样数据库保存大图,显示小图的时候replace下点为_s.就可以显示小图了
3 年多之前 回复
wangyantao_hb
wangyantao_hb 现在有很多图片已经上传了,我想着直接把图片变成缩略图显示,怎么弄
3 年多之前 回复
moonwrite
moonwrite   Rxr 2014.12.10 14:21

给你一个思路:url重写
///
/// ResponseImg 的摘要说明
///
public class ResponseImg : IHttpHandler
{
static readonly DateTime Refresh;
static readonly DateTime Now;
static ResponseImg()
{
Now = DateTime.Now;
Refresh = Now.AddMonths(1);
}

    public void ProcessRequest(HttpContext context)
    {

        if (!string.IsNullOrEmpty(context.Request.Headers["If-Modified-Since"]))
        {
            DateTime IfModifiedSince = DateTime.Parse(context.Request.Headers["If-Modified-Since"]);
            if (IfModifiedSince > Now)
            {
                context.Response.StatusCode = 304;
                return;
            }
        }

        //string folder = context.Request.QueryString["Folder"];
        string filepath = context.Request.QueryString["FilePath"];
        int width = int.Parse(context.Request.QueryString["Width"]);
        int height = int.Parse(context.Request.QueryString["Height"]);
        string hex = context.Request.QueryString["Hex"];

        string path = context.Server.MapPath(string.Format("/QshopImg/{0}", filepath));

        byte[] bytes = ImageHelper.Reset(path, width, height);//这个是我写的图片压缩方法 你自己重新上网找
        //System.Drawing.Image img = ImageHelper.Reset(bytes, width, height);

        context.Response.Headers["Last-Modified"] = Refresh.ToString();
        //context.Response.Cache.SetExpires(DateTime.Now.Add(Refresh));
        //context.Response.Cache.SetMaxAge(refresh);
        context.Response.Cache.SetCacheability(HttpCacheability.Public);
        context.Response.CacheControl = HttpCacheability.Public.ToString();
        context.Response.Cache.SetValidUntilExpires(true);
        //context.Response.StatusCode = 304;
        //img.Save(context.Response.OutputStream, ImageHelper.GetImageFormat(path));
        context.Response.ContentType = "image/" + hex;

        context.Response.BinaryWrite(bytes);

    }

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



        <rewrite url="~/(p_img\d{3}/.+?)_(\d{1,3})x(\d{1,3})\.(jpg|jpeg|png|gif|bmp)$"
         to="~/ResponseImg.ashx?FilePath=$1&amp;Width=$2&amp;Height=$3&amp;Hex=$4"/>

                    比如原图片的是/xxx/yyy.png
                    /xxx/yyy_64x64.png 
                    那么就会请求到ResponseImg.ashx 同时把原来的图片压缩成64*64 再输出

                    你还可以把压缩后的图片缓存起来,避免再次压缩
testcs_dn
testcs_dn   Rxr 2015.01.05 09:47

System.Drawing.Bitmap bmp = new Bitmap(文件目录);
bmp.GetThumbnailImage(宽度,高度,);

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
大图转换成小图 图片压缩 不失真的做法
自定义小图片的大小 图片压缩 不失真的做法
鼠标悬停在小图上,自动出现大图的代码
首先原图片就是大图片, 1.小图所在的div,用style=overfow:hidden;width:100px;height:100px;和 来限定图片显示大小,只显示为高宽100px z-index:2; display:none;"> 2.用于显示大图即原本大小图的div,style=display:none;让它先不显示 function show(_this) { document
可以把图片瞬间压缩成自己想要的分辨率和大小的一个东西
可以把图片瞬间压缩成自己想要的分辨率和大小的一个东西 直接把图片拖进下方的框框就好
DOM基础1之点击小图片显示对应的大图
需求:点击小图片使大图片显示与之对应
商品详情页中,当鼠标放到小图上时,改变大图的图片为当前小图的图片
在做商品详情页时,我们会遇到这样的问题,当鼠标移动到小图上的时候,所对应的大图也会随之改变,变成当前鼠标所在位置的小图图片,今天我给大家分享一下我的做法,希望对大家有所帮助,也希望得到大家的指点. //首先引入jq文件,我用的是tp框架,jq文件是放在根目录Public文件夹下的 //首先给小图绑定 mouseover 事件 $('#J_SmallImgs img').mou
小图轮播对应显示大图
自动轮播图     .dpcphdp{position: relative;overflow: hidden;width: 100%;margin-top: 10px;float: left;} .dpcphdp .bigImg{width:290px;height: 310px;position: relative;width: 100%;float: left;} .dpcphd
js实现点击右侧小图左侧显示大图带控制按钮
js实现点击右侧小图左侧显示大图带控制按钮
腾迅图片轮换效果展示
类似图片新闻首页的效果图,点击小图显示大图!
鼠标滑过显示图片大图效果
描述: 当用户将鼠标放到 图片上时,显示图片的大图。 效果图: 说明: 用到了mouseover、mouseout、mousemove三个事件,分别表示鼠标滑过图片、鼠标移除图片、鼠标在图片上移动三个事件。 对于mouserover事件,做以下几件事: 获取原标题,并将标题置为空,防止title和提示框同时出现。 创建提示框对象,并将图片地址和title放入其中显示。 设置
jquery小图片左右滚动点击小图切换显示上面大图
jquery小图片左右滚动点击小图切换显示大图