• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

【ASP.NET】GridView数据库图片续

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
数据库表

Since the images are stored in a database (BLOB),
we need to retrieve the image as a byte array and do a binary write for the images to display in the webpage.


HTTPHandler
     Synchronous HttpHandler 
     Asynchronos HttpHandler

Synchronous HttpHandler should implement System.Web.IHttpHandler
Asynchronous HttpHandler should implement System.Web.IHttpAsyncHandler

同步的, IHttpHandler成员有两个
ProcessRequest()
            This method is the core of HttpHandler as it does all the processing of an HttpHandler.
IsReusable
            This property specifies whether the HttpHandler can be reused for similar request.

具体步骤
     a. 添加一个Image Control,设置ImageUrl属性
      imImage.ImageUrl = '<%# "ImageHandler.ashx?ImID="+ Eval("ImageID") %>'
     b. 对于GridView来说,添加一列ImageField, 设置属性
     <asp:ImageField DataImageUrlField="ImageID
              DataImageUrlFormatString="ImageHandler.ashx?ImID={0}" HeaderText="Image">
     </asp:ImageField> 
构建一个页面ImageHandler.aspx负责fetches the image from database and do a BinaryWrite .i.e. the final code will be like, 

string imageid = context.Request.QueryString["ImID"];
SqlConnection connection 
= new SqlConnection(ConfigurationManager.ConnectionStrings["connectionString"].ConnectionString);
connection.Open();
SqlCommand command 
= new SqlCommand("select Image from ImageTable where ImageID="+imageid, connection);
SqlDataReader dr 
= command.ExecuteReader();
dr.Read();
context.Response.BinaryWrite((Byte[])dr[
0]);
connection.Close();
context.Response.End();

ProcessRequest方法是如何get the access of Response object?  看ProcessRequest方法签名
public void ProcessRequest (HttpContext context) {}
The context object will give access to necessary object about the request. 
通过它我们可以do a BinaryWrite using Response object.
context.Response.BinaryWrite((Byte[])dr[0]);

Thumbnail
通过这种方法的缺陷是:it will stretch the gridview column based on the dimensions of the images stored
因此用Thumbnail的形式,加上click放大的功能,就更好了。
popup in window
1. Crete a Thumbnail.ashx

].ConnectionString);
        connection.Open();
        SqlCommand command = new SqlCommand("select Image from GamePictures where ImageID=" + imageid, connection);
        SqlDataReader dr 
= command.ExecuteReader();
        dr.Read();     
        Stream str 
= new MemoryStream((Byte[])dr[0]); 
        Bitmap initialBMP 
= new Bitmap(str);  
        
        
//With the help of Graphics class, the thumbnail image is constructed from the original bitmap    
        Bitmap thumbnailImage = new Bitmap(100100);
        
        Graphics g 
= Graphics.FromImage(thumbnailImage);
        g.InterpolationMode 
= System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
        g.FillRectangle(Brushes.White, 
00100100);
        g.DrawImage(initialBMP, 
00100100);
        
        
//make thumbnail image to byte array
        MemoryStream ms = new MemoryStream();
        thumbnailImage.Save(ms, System.Drawing.Imaging.ImageFormat.Png);
        
byte[] bmpBytes = ms.GetBuffer();

        thumbnailImage.Dispose();
        ms.Close();
        
        
//BinaryWrite
        context.Response.BinaryWrite(bmpBytes);
        connection.Close();
        context.Response.End(); 
2. GridView
<asp:TemplateField HeaderText="Thumbnail(can click)">
     
<ItemTemplate> 
         
<href="javascript:void(window.open('<%# "FullImageHandler.ashx?ImID="+ Eval("ImageID")%>','_blank','toolbar=no,menubar=no'))" > 
           
<asp:Image ID="Image1" runat="server" ImageUrl='<%# "ThumbnailHandler.ashx?ImID="+ Eval("ImageID")  %>'/> 
         
</a>
      
</ItemTemplate>
</asp:TemplateField>

图片是经过ThumbnailHandler.ashx处理了,点击图片,调用JavaScript   window.open 

Popup in same page
有些浏览器可能关闭了popup window,因此更好的方式是将FullImage放在同一个页面的<Div>里,设置display:none
点击thumbnail image, we can enable the DIV tag through a javascript function and pass the ImID of the image to call the FullImage.ashx HttpHandler for displaying the full image in the <img> tag.

执行结果


代码下载: Source Code (实现了上传的功能)

另:
建立局域网的web 服务,publish你的website后,要设置IIS的站点属性 Web site Identification的IP Address为本机的IP地址,不能是“未分配”
还有要修改你的APP_DATA文件夹写的属性,默认是只读的,不能写入数据库。

参考:
HttpHandler in ASP.Net: PART 1
HttpHandler in ASP.Net: PART 2
GridView with Thumbnail Images – Part 1   in  codedigest
ThumbNail Image Creation By Rick


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
如何使用jQuery向asp.netMvc传递复杂json数据-ModelBinder篇发布时间:2022-07-10
下一篇:
ASP.NET状态管理之四:Cache发布时间:2022-07-10
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap