I'm using Web Api 2 with C# and Azure, and having issues with how to return the image (base from Memorystream) for displaying on the page...
Here is my Controller HTTPGET
[Route("api/PhotoSubmit/GetPhoto/{id}")]
[HttpGet]
public HttpResponseMessage GetPhotoById(int id)
{
StorageServices storage = new StorageServices();
MemoryStream ms = storage.DownloadBlob(id);
// return what ?
}
Here is the beginning of the servicecall :
$http({
method: 'GET',
url: 'api/PhotoSubmit/GetPhoto/' + $routeParams.id,
accept: 'application/json'
})
.success(function(result) {
// How do i handle the result and what HTML should i use ? <img ?
});
From the client side you don't need to use $http. You can simplify the process by using plain old HTML...
<img src="/api/PhotoSubmit/GetPhoto/2232" />
For dynamic images use JQuery like this...
$('#ImageLocation').html('<img src="/api/PhotoSubmit/GetPhoto/' + intID + '" />');
The web browser will automatically do the work of making an HTTP Request for the image, saving you all the complexity.
On the server side, you can use a process like these to load the file and stream it to the client. It's important that the Server code return the correct MIME type such as...
context.Response.ContentType = "image/png";
Resources:
ASP .Net Web API downloading images as binary
...and...