I’m using a database to store clients’ images as bytes. How can I render these images on an .aspx page?
Answers:
Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.
Method 1
Two solutions.
- Build a handler page. That takes an ImageID/RowID as GET parameter and returns data with mimetype image/jpeg or image/png.
-
Use DATA uri scheme as explained on wikipedia.
<img src=”data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP
C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA
AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J
REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq
ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0
vr4MkhoXe0rZigAAAABJRU5ErkJggg==” alt=”Red dot” />
Method 2
Instructions can be found here: http://www.dotnetcurry.com/ShowArticle.aspx?ID=129&AspxAutoDetectCookieSupport=1
in step 4, but the whole article is worth a read.
Method 3
This can be done easily by converting the Byte Array to a Base64 image.
public string GetImageAsBase64String(byte[] bin)
{
if (bin != null)
{
return "<img src="data:image/jpeg;base64," + Convert.ToBase64String(bin) + "">";
}
else
{
return null;
}
}
//usage, for demo purposes an uploaded image from a FileUpload Control
Label1.Text = GetImageAsBase64String(FileUpload1.FileBytes);
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0