Displaying Database Images in Gridview with HttpHandler

问题

I am trying to use an ashx page as a http handler for images stored in an SQL server database. These Images are to be displayed in a gridview on an aspx page.

<%@ WebHandler Language="C#" Class="LinqHandler" %>

using System;
using System.Web;
using System.Drawing.Imaging;
using System.Collections.Generic;
using System.Data.SqlClient;
using System.Configuration;
using System.IO;


public class LinqHandler : IHttpHandler {

    public void ProcessRequest(HttpContext context)
    {
        SqlConnection connect = new SqlConnection();
        connect.ConnectionString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;

        SqlCommand command = new SqlCommand();
        command.CommandText = "SELECT roomID,roomNumber,roomImage1 FROM Rooms " 
                              + "WHERE roomID = @roomID";
        command.CommandType = System.Data.CommandType.Text;
        command.Connection = connect;

        SqlParameter RoomID = new SqlParameter("@roomID", System.Data.SqlDbType.Int);
        RoomID.Value = context.Request.QueryString["roomID"];
        command.Parameters.Add(RoomID);
        connect.Open();
        SqlDataReader dr = command.ExecuteReader();
        dr.Read();
        context.Response.BinaryWrite((byte[])dr["roomImage1"]);
        context.Response.ContentType = "image/gif";
        dr.Close();
        connect.Close();
    }

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

for some reason, the images don't bind to the asp:Image control on the aspx page. I'm stumped as to why.

Here is the databinding snippet:

<asp:GridView ID="GridView1" runat="server"
    CssClass="gridviews" PagerStyle-CssClass="pager"
    DataKeyNames="roomID"  AlternatingRowStyle-CssClass="alt"
    AutoGenerateColumns="False"   DataSourceID="SqlDataSource1">
   <Columns>
     <asp:BoundField DataField="roomID" HeaderText="roomID" />
     <asp:BoundField DataField="roomNumber" HeaderText="Room Number" />
     <asp:TemplateField HeaderText="Image 1">
        <ItemTemplate>
          <asp:Image runat="server" ID="pic1" 
              ImageUrl='<%# "~/LinqHandler.ashx?roomID=" + Eval("roomID") %>'>
          </asp:Image>
        </ItemTemplate>
     </asp:TemplateField>
   </Columns>
</asp:GridView>

<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
     ConnectionString="<%$ ConnectionStrings:ConnectionString %>" 
     SelectCommand="SELECT [roomID], [roomNumber], [roomImage1] FROM [Rooms]">
</asp:SqlDataSource>

回答1:

you can use Handler.ashx for show image. For example:

<img src="Handler.ashx?roomID=1" />

this way you can show image of the one number room.

If you want to do it another way, you can use base64 in css. You dont need to use handler. For example:

<img runat="server" ID="image"/>

//code behind
var bytes = (byte[])dr["roomImage1"]);
var base64String = System.Convert.ToBase64String(bytes, 0, bytes.Length);
image.src = "data:image/gif;base64,"+ base64String;

EDIT:

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        var bytes = (byte[])((DataRow)e.Row.DataItem)["roomImage1"];
        var base64String = System.Convert.ToBase64String(bytes, 0, bytes.Length);
        var image = (Image)e.Row.FindControl("pic1");
        image.ImageUrl = "data:image/gif;base64,"+ base64String;
        //or
        image.ImageUrl = "LinqHandler.ashx?roomID="+((DataRow)e.Row.DataItem)["roomID"];
    }
}

回答2:

Try as below:

  <ItemTemplate>
    <asp:Image ID="pic1" runat="server" 
        ImageUrl='<%# Eval("roomID", "LinqHandler.ashx?roomID={0}") %>' 
        Height="100px" Width="80px" />
  </ItemTemplate>

回答3:

It turns out that my problems stem from inserting garbage into my SQL BLOB fields. There is nothing wrong with the retrieval mechanism posted in my source code. If you are curious to see the insert statements I used, let me know and I will be glad to post them.

来源：https://stackoverflow.com/questions/9573633/displaying-database-images-in-gridview-with-httphandler

标签

ASP.NET

image

httphandler