Pls modify this code for retrieving the image from sqldatabase

Question

I am still suffering from retrieving an image from a SQL database. This is my final solution for inserting and retrieving an image from database. Here is all my code:
GUI part:

<div>
    <asp:Label ID="lblImage" runat="server" Text="Image"></asp:Label>
    &nbsp;&nbsp;&nbsp;&nbsp;
    <asp:FileUpload ID="imageUpload" runat="server" />   
    <br />
    <asp:Label ID="lblFilename" runat="server" Text="Filename"></asp:Label>
    <asp:TextBox ID="txtFilename" runat="server"></asp:TextBox>   
    <br />
    <br />
    <asp:Button ID="BtnSave" runat="server" Text="SAVE" onclick="BtnSave_Click" />   
    <br />
    <br />
    <br />
    <asp:Image ID="Image1" runat="server" />  
</div>

And under the Button click event i have written the following code:

protected void BtnSave_Click(object sender, EventArgs e)
{
    string uploadFileName = string.Empty;
    byte[] imageBytes = null;
    if (imageUpload != null && imageUpload.HasFile)
    {
        uploadFileName = imageUpload.FileName;
        imageBytes = imageUpload.FileBytes;
    }
    string str = ConfigurationManager.ConnectionStrings["ImageConnectionString"].ConnectionString;
    SqlConnection con = new SqlConnection(str);
    SqlCommand com = new SqlCommand("INSERT INTO REPORT_TABLE (IMAGEFIELD,IMAGENAME) VALUES (@image,@filename)", con);
    com.Parameters.Add("@image", SqlDbType.Image, imageBytes.Length).Value = imageBytes;
    com.Parameters.Add("@filename", SqlDbType.VarChar, 50).Value = uploadFileName;
    con.Open();
    com.ExecuteNonQuery();
    con.Close();

    SqlConnection conn = new SqlConnection(str);
    string sql = "SELECT * FROM [REPORT_TABLE]";       
    SqlDataAdapter da = new SqlDataAdapter(sql, conn);
    DataSet ds = new DataSet();
    da.Fill(ds);
    DataRow dr = ds.Tables[0].Rows[0];
    Byte[] b = (Byte[])dr["IMAGEFIELD"];
    MemoryStream ms = new MemoryStream(b);     

 **this.pictureBox1.Image = Image.FromStream(ms)**; //(This code is for a Windows application but I want to retrieve an image from a web application) so what should be written instead of the highlighted code?  In imagecontrol, image id is Image1.
}

Answer 1

you can server image like this:

    .....
    Image img= Image.FromStream(ms);
    Response.Clear();
    Response.ContentType = "image/jpeg";
    img.Save(Response.OutputStream, ImageFormat.Jpeg);
}

but this will not put image in the <asp:Image ID="Image1" runat="server" /> because it needs image url not the image object :(

what you can do is setup a separate page to serve image and pass it image id or other unique identifier associated with image to show it in the <asp:Image ID="Image1" runat="server" />. simply add new page to your solution say ImageServer.aspx and in page_load write following:

protected void Page_Load(object sender, EventArgs e)
{
     if(Request.QueryString.HasValues())
     {
          var id=Request.QueryString["id"];
          if(!string.IsEmptyOrNull(id))
          {
              SqlConnection conn = new SqlConnection(str);
              //CHANGE SELECT TO GET ONLY IMAGE WITH PASSED ID
              string sql = "SELECT * FROM [REPORT_TABLE]";
              SqlDataAdapter da = new SqlDataAdapter(sql, conn);
              DataSet ds = new DataSet();
              da.Fill(ds);
              DataRow dr = ds.Tables[0].Rows[0];
              Byte[] b = (Byte[])dr["IMAGEFIELD"];
              MemoryStream ms = new MemoryStream(b);     

              Response.Clear();
              Response.ContentType = "image/jpeg";
              var img=system.Drawing.Image.FromStream(ms);
              img.Save((Response.OutputStream, ImageFormat.Jpeg);
              Response.Flush();
              return;
          }
          //HERE YOU MAY RETURN DEFAULT OR ERROR IMAGE
     } 
}

Now change you button click in upload page as follows:

protected void BtnSave_Click(object sender, EventArgs e)
{
    ....
    //SAVE IMAGE TO DB AND GET IMAGE ID (TO IDENTIFY THIS IMAGE)
    image.ImageUrl = "YOUR_SERVER\ImageServer.aspx?id=" + IMAGE_ID;
}