Storing and retrieving images from Database

Question

I created an ASP.NET/C# application to upload an image to MySQL database. The process executes without any error but for whatever image I upload I am getting output of 100x100 white image. The procedure I followed is.

1) Created a database with field picture and type Binary(255).

2) Uploaded an image as cmd.Parameters.Add("@picture", OdbcType.Binary, 255).Value = FileUpload1.FileBytes;

3) Doing above a new record is being inserted and a value something of below kind is generated. 89504e470d0a1a0a0000000d49484452000002600000010008020000009b155d400000100049444154789cd4dc05745b57a2377a15c26088d99651b2248b999959b2c0966cc9cccccc8e1ddb01439899d3a4499a869999e33037d0340d34d4b4d5dbaee7e6f6b5337367eefad67bf3adf55f676dd98e221f6b9ddffeef738e20db5cbf826c77fd3638d8eafa6587ebd79daedfc0f6afd9eefae5ab372fd6bf7db9e5e7b7075dae4daf5e1c76b98ebb5cfb7ef935a5b31b028b32ea53f6ec3a77efe60fb919156e34222b297ee3aedd2e97ebe6dd870b96acd8b0efc0891bb76ae7ce8ba9a8dc70f1f2c917afaeb95ce75c1f276cd988b0180329c4c4aaf2d2

//--------------- Uploading module completed -----------------//

1) Created a ASPX page with

<asp:Image ID="img" runat="server" ImageUrl="~/MyImage.ashx" />

2) Left ASPX.CS file without any code

3) Added a ASHX file with

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

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Drawing.Imaging;

public class MyImage : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "image/png";
        var data = "89504e470d0a1a0a0000000d49484452000002600000010008020000009b155d400000100049444154789cd4dc05745b57a2377a15c26088d99651b2248b999959b2c0966cc9cccccc8e1ddb01439899d3a4499a869999e33037d0340d34d4b4d5dbaee7e6f6b5337367eefad67bf3adf55f676dd98e221f6b9ddffeef738e20db5cbf826c77fd3638d8eafa6587ebd79daedfc0f6afd9eefae5ab372fd6bf7db9e5e7b7075dae4daf5e1c76b98ebb5cfb7ef935a5b31b028b32ea53f6ec3a77efe60fb919156e34222b297ee3aedd2e97ebe6dd870b96acd8b0efc0891bb76ae7ce8ba9a8dc70f1f2c917afaeb95ce75c1f276cd988b0180329c4c4aaf2d2";
        var buffer = StringToByteArray(data);
        context.Response.OutputStream.Write(buffer, 0, buffer.Length);
    }

    private byte[] StringToByteArray(string hex)
    {
        return Enumerable
            .Range(0, hex.Length)
            .Where(x => x % 2 == 0)
            .Select(x => Convert.ToByte(hex.Substring(x, 2), 16))
            .ToArray();
    }
    public bool IsReusable
    {
        get { return false; }
    }
}

By executing this code a white 100x100 image is being displayed in output for any colorful input. I double checked ContentType and uploaded various images of various sizes and formats but whatever I do I am getting an output of same White image. What's wrong in my code? any corrections?

not being an expert on MySQL, but are you creating the column with a maximum length of 255bytes? therefore the maximum image size is indeed, 255 bytes? — kolin, Jan 13 '12 at 11:42

score 1 · Accepted Answer · edited May 23 '17 at 10:24

You can try saving the image as a Base64 encoded string, then converting it back to an image when you want it to render on your web page.

Here is a link on how to do it.

Base64String to Image and visa versa

Here is a link to how I used it in my project, not quite from an image or from a database but the concept is the same.

When using my method in your webpage you'll use

<img src="${downloadurl}" />

kolin · Answer 2 · 2012-01-13T13:38:49.070

I have this code in an ashx which pulls image data and displays it from an MSSQL database

public void ProcessRequest(HttpContext context)
    {
        Guid picid;
        if (context.Request.QueryString["picid"] != null)
            picid = new Guid(context.Request.QueryString["picid"]);
        else
            throw new ArgumentException("No parameter specified");

        context.Response.ContentType = "image/jpeg";
        Stream strm = ShowPicImage(picid);
        byte[] buffer = new byte[4096];
        int byteSeq = strm.Read(buffer, 0, 4096);

        while (byteSeq > 0)
        {
            context.Response.OutputStream.Write(buffer, 0, byteSeq);
            byteSeq = strm.Read(buffer, 0, 4096);
        }
    }

    public Stream ShowPicImage(Guid piciddata)
    {
        ProductPicture pictureData = new ProductPicture("ProductPictureID", piciddata);
        object img = pictureData.Data;
        try
        {
            return new MemoryStream((byte[])img);
        }
        catch
        {
            return null;
        }
    }

i don't know if it's something you can try for your problem. (Where the pictureData.Data property type is a byte[] and the relevant database column is a varbinary(max))

updated answer

You may also want to consider storing the data in the database as a BLOB

score 0 · Answer 3 · answered Jan 13 '12 at 11:50

0

A 255 byte binary field type is not going to be large enough to handle anything except the very tiniest of images. Check the size of the files you are uploading and re-size the field accordingly.

answered Jan 13 '12 at 11:50

E.J. Brennan

45,870
7
88
116

Storing and retrieving images from Database

3 Answers3