Image Uploading Using REST API in WCF

In most of applications, now a days, image uploading is a common job. And there are many ways to upload an image on a server or in a database. This article explains how to upload an Image in byte format in a database using image streaming.

Here, I have created a REST API in WCF to upload an image and one ASP.Net web application to consume that API. I have attached a solution file to this article and you can download and try it on your machine.

Here I have pasted the code to upload an image in byte format in a database. The image should be posted in stream format on the service.

API implementation

I assume you are familiar with WCF services, so I will not cover that in this article. So first of all, we need to declare an operation contract method with ResponseFormat, UriTemplate and Method in Interface to expose the API.

  1. [ServiceContract]  
  2.     public interface IService1
  3.     {  
  4.         [OperationContract]                
  5.         [WebInvoke(ResponseFormat = WebMessageFormat.Json, UriTemplate = "PostImage", Method = "POST")]  
  6.         string PostImage(Stream sm);  
  7.           
  8.     }   
 After this, we need to write functionality for the preceding method in the Service file (.svc).
  1. public class Service1: IService1
  2.     {   
  3.   
  4.       public string PostImage(Stream sm)  
  5.          {  
  6.            System.Drawing.Bitmap imag = new System.Drawing.Bitmap(sm);  
  7.            byte[] imagedata = ImageToByte(imag);  
  8.             //Write code here to Save byte code to database..  
  9.           return "success";  
  10.         }  
  11.   
  12.        public static byte[] ImageToByte(System.Drawing.Image img)  
  13.         {  
  14.              
  15.             ImageConverter converter = new ImageConverter();  
  16.             return (byte[])converter.ConvertTo(img, typeof(byte[]));  
  17.         }  
  18.    }  
You need to host your service on the server (IIS or which one you prefer). And provide that service location URL in the client-side application.

Client-Side application

Now we need to create a web application to consume the API. I am giving here the method functionality that will post an image on the server using the REST API. You can call this method on any button click or File change event or on any event that should upload the image.
  1. public void PostData()  
  2.     {  
  3.         try  
  4.         {  
  5.              byte[] fileToSend = null;  
  6.         string name = "";  
  7.           
  8.         if (FileUpload1.HasFile)  
  9.         {  
  10.             name = FileUpload1.FileName;  
  11.             Stream stream = FileUpload1.FileContent;  
  12.             stream.Seek(0, SeekOrigin.Begin);  
  13.             fileToSend = new byte[stream.Length];  
  14.             int count = 0;  
  15.             while (count < stream.Length)  
  16.             {  
  17.                 fileToSend[count++] = Convert.ToByte(stream.ReadByte());  
  18.             }  
  19.               
  20.         }  
  21.         //Here provide your service location url in below line. You need to host your service on server(IIS or which one you prefer)
  22.         HttpWebRequest req = (HttpWebRequest)HttpWebRequest.Create   
  23.                        ("http://localhost:63624/Service1.svc/PostImage");  
  24.         
  25.         req.Method = "POST";  
  26.         req.ContentType = "application/octet-stream";  
  27.         req.ContentLength = fileToSend.Length;  
  28.         Stream reqStream = req.GetRequestStream();  
  29.         reqStream.Write(fileToSend, 0, fileToSend.Length);  
  30.         reqStream.Close();  
  31.   
  32.         HttpWebResponse resp = (HttpWebResponse)req.GetResponse();  
  33.   
  34.         StreamReader reader = new StreamReader(resp.GetResponseStream());  
  35.   
  36.         string result = reader.ReadToEnd();  
  37.         }  
  38.         catch (Exception ex)  
  39.         {  
  40.               
  41.             throw ex;  
  42.         }  
  43.     }  
That's all we must do. You can download the attached file and try it yourself. In the attached file, WebApplication1 is a client-side application that consumes the service. You can look at the Test.aspx page and feel free to ask any question regarding this.


Similar Articles