Need to convert bytes to image in web page ASP.Net C#: C#, ASP.Net

by: wht1986Posted on 2009-05-21 at 14:33:48ID: 24446124

I've always used an ashx handler but i imagine an asmx should not be much harder to implement.

<img src='http://www.site.com/yourservice.asmx/yourmethod?someImageParameter=12' />

Just make sure the web service can accept http GET, not just post

by: wht1986Posted on 2009-05-21 at 14:34:55ID: 24446138

add this to your web.config to turn on httpget and post

<configuration>
<system.web>
<webServices>
<protocols>
<add name="HttpGet"/>
<add name="HttpPost"/>
</protocols>
</webServices>
</system.web>
</configuration>

by: RinaXPosted on 2009-05-21 at 14:45:52ID: 24446222

Let me be clearer. I have the bytes already saved in a byte[] array variable, imageBytes. I need to then take those bytes and convert them to an image. The only thing the web service does is deliver the image as bytes.

by: wht1986Posted on 2009-05-21 at 15:23:10ID: 24446445

I understood that, if the bytes being returned are the bytes of the image, then setting the src of your html img element or webcontrol image will automatically display those bytes as an image.

I typically create a handler called Image.ashx which takes a querystring parameter to say what image to return. then on the web page I just have to say

<asp:Image ID="Image1" runat="server" ImageUrl="Image.ashx?ImageNumber=3" />

Here's an example of the handler
http://www.eggheadcafe.com/articles/20041104.asp

The most important part is setting of the content type
Response.ContentType = "image/Jpeg";
Response.BinaryWrite( yourBytes[] );

So what I am saying is if you are using a web service, you can call a particular method of the asmx by setting the URL appropriately as above to obtain the same results. If you want I can work on a working example when I get home this evening.

by: wht1986Posted on 2009-05-21 at 20:08:34ID: 24447519

I did a quick example. Picture 1 below shows I have 2 images in a folder. Picture 2 below shows the web page displaying the images. The Wem Service and aspx page are included in the code snippet below

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class WebService : System.Web.Services.WebService
{
    public WebService() { }
 
    [WebMethod]
    public byte[] GetImage(string filename)
    {
 
        byte[] rawData = File.ReadAllBytes(Server.MapPath("images\\" + filename));
        HttpContext.Current.Response.ContentType = "image/Jpeg";
        HttpContext.Current.Response.BinaryWrite(rawData);
        HttpContext.Current.Response.End();
        return rawData;
    }
}
 
===================
 
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:Image ID="Image1" runat="server" ImageUrl="WebService.asmx/GetImage?filename=1.jpg" />
        <asp:Image ID="Image2" runat="server" ImageUrl="WebService.asmx/GetImage?filename=2.jpg" />
    </form>
</body>
</html>

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:

Select all Open in new window

Capture1.JPG
- 19 KB
working web page
Capture.JPG
- 29 KB
my VS solution

by: wht1986Posted on 2009-05-21 at 20:10:09ID: 24447526

oops sorry meant to take out the return as we dont really need it

    [WebMethod]
    public void GetImage(string filename)
    {
 
        byte[] rawData = File.ReadAllBytes(Server.MapPath("images\\" + filename));
        HttpContext.Current.Response.ContentType = "image/Jpeg";
        HttpContext.Current.Response.BinaryWrite(rawData);
        HttpContext.Current.Response.End();
    }

1:
2:
3:
4:
5:
6:
7:
8:
9:

Select all Open in new window

by: techprocessPosted on 2009-05-22 at 01:36:04ID: 24448836

<asp:Image id="img1" src="View.aspx" runat="server"/>

and on View.aspx.cs write on page load function...
protected void Page_Load(object sender, EventArgs e)
{
byte[] Array= fnGetByteArrayFromWebService();// get it from ur web service .
Response.ContentType="image/Jpeg";
Response.BinaryWrite(Array);
Response.Flush();
Response.End();
}

by: RinaXPosted on 2009-05-22 at 08:08:19ID: 24451858

Okay, I don't link to the asmx page at all in my app, I go through the WSDL. This is an external web service that our imaging department is letting us use to retrieve images of specific documents when a clerk enters the number for a specific document. So I send a soap request and get a reply that is in bytes. So the image is nowhere on my own drive or in any of my folders.

Example:

GetDocument doc = new Document(); <-- the main object
DocRequest req = new Request; <--object to send request parameters

encodedReply reply = doc.GetEncodedDoc(req); <-- If successful parameter returned is in bytes
Bytes[] imageBytes = new byte[60000];

imageBytes = reply.Results.imageDocument <---bytes of image

Right here is where I need to start. I've implemented the solution via the separate aspx page, but nothing happens:

I created a new web page ImageGenerator.aspx
protected void Page_Load(object sender, EventArgs e)
{
if (Session["Image"] != null)
{
GetImage();
}
}

public void GetImage()
{
byte[] ByteArrContent = (byte[])Session["Image"];
//Response.OutputStream.Write(ByteArrContent, 0, ByteArrContent.Length);
Response.ContentType = "image/tiff";
Response.BinaryWrite(ByteArrContent);
Response.Flush();
Response.End();
}

And added this line in my main page that's making the call:

<asp:Image ID="clmImg" ImageUrl="ImageGenerator.aspx" runat="server" />

Also, the call to the web service is initiated when the user presses a button. I don't know if that will make a difference.

by: wht1986Posted on 2009-05-22 at 09:46:36ID: 24452877

Ok if the web service is completely outside your realm of control, then you need to do a hybrid approach like techprocess showed. Basically create an additional aspx page that gets the bytes from the webservice and then streams that back to the browser. Attached is a screenshot of my solution where i have an external web service that returns a stream of bytes of an image. The image chosen in based on an integer value passed to the web service.

======================================
The main page
======================================
 
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:Image ID="Image1" ImageUrl="Image.aspx?ID=1" runat="server" />
    </form>
</body>
</html>
 
======================================
Ihe page that handles streaming back the image
======================================
// Image.aspx.cs
 
public partial class Image : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        int imageID = int.Parse(Request.QueryString["ID"]);
        ImageService.WebService svc = new ImageService.WebService();
        byte[] imagedata = svc.GetImage(imageID);
        Response.ContentType = "image/Jpeg";
        Response.BinaryWrite(imagedata);
        Response.End();
    }
}

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:

Select all Open in new window

Capture.JPG
- 21 KB
VS Solution

Question

Need to convert bytes to image in web page ASP.Net C#

Subscribe now for full access to Experts Exchange and get

Instant Access to this Solution

C#

ASP.Net

Programming for ASP.NET

Trusted by hundreds of thousands everyday for fast, accurate and reliable tech support.

See what Experts Exchange can do for you.

Got a question?

We've got the answer.

Need individual assistance?

Our experts are ready to help.

Want to learn from the best?

Read articles from industry experts.

Working on a long term project?

Store your work and research.

What Makes Experts Exchange Unique?

Trusted by the world's most respected brands.

Faithfully serving IT professionals since 1996.

Related Solutions

Free Tech Articles

Cloud Class Webinars

Join the Community

Give a Little. Get a Lot.

Answers

3 Ways to Join

The Experts

The Experts

Testimonials

Testimonials

Testimonials

Business Clients

Business Clients

In the Press

In the Press

In the Press