MVC WebAPI return multiple images

Question

I have 3 images in a directory but my code always returns one of them. I'd like to return 3 images image1.jpg, image2.jpg, image3.jpg and get them in my Xamarin app.

I think returning the result like an array might solve the problem but I don't understand what I need.

        var result = new HttpResponseMessage(HttpStatusCode.OK);

        MemoryStream ms = new MemoryStream();
        for (int i = 0; i < 3; i++)
        {
            String filePath = HostingEnvironment.MapPath("~/Fotos/Empresas/Comer/" + id + (i + 1) + ".jpg");

            FileStream fileStream = new FileStream(filePath, FileMode.OpenOrCreate);

            Image image = Image.FromStream(fileStream);
            image.Save(ms, ImageFormat.Jpeg);
            fileStream.Close();

            byte[] bytes = File.ReadAllBytes(filePath);
            byte[] length = BitConverter.GetBytes(bytes.Length);

            // Write length followed by file bytes to stream
            ms.Write(length, 0, 3);
            ms.Write(bytes, 0, bytes.Length);
        }

        result.Content = new StreamContent(ms);

        return result;

Now i getting bytes, i edit a little bit the code now

        byte[] imageAsBytes = client.GetByteArrayAsync(url).Result; 

        MemoryStream stream1 = new MemoryStream(imageAsBytes);
        img.Source = ImageSource.FromStream(() => { return stream1; });

this is my xamarin code to get images, but i still getting nothing =/

Consider returning an object which has 3 byte arrays in it. Use File.ReadAllBytes() to read the entire image file into a byte array on the server side. The front end Xamarin client would have to convert each byte array into an image. One caveat is there is a limit to the total bytes returned by a WebAPI call. — stak, Oct 17 '19 at 19:14
result.Content = new ByteArrayContent(memoryStream.ToArray()); will overwrite the current value of result.Content every time through the loop. I'd expect it to return the last image processed each time it is called. — stak, Oct 17 '19 at 19:16
i think i get the wrong way in my xamarin, i'll show in edit the way to i converted the bytes — DevYuri, Oct 18 '19 at 14:05

score 1 · Answer 1 · answered Oct 18 '19 at 00:36

If you just return a memorystream is not easy to differentiate one image from the other in the stream, instead of this, you can return a List of byte arrays, then you can access each position in the array and convert from byte array to image...

Here is a fully functional dotnet core webapi controller :

public class GetImagesController : Controller
{
    private readonly IWebHostEnvironment _host;

    public GetImagesController(IWebHostEnvironment host)
    {
        _host = host;
    }

    [HttpGet("{images}")]
    public async Task<List<byte[]>> Get([FromQuery]string images)
    {
        List<byte[]> imageBytes = new List<byte[]>();
        String[] strArray = images.Split(',');
        for (int i = 0; i < strArray.Length; i++)
        {
            String filePath = Path.Combine(_host.ContentRootPath, "images", strArray[i]+".jpg");
            byte[] bytes =  System.IO.File.ReadAllBytes(filePath);
            imageBytes.Add(bytes);

        }
        return imageBytes;
    }
}

This controller can be called like this :

https://localhost:44386/getImages?images=P1,P2,P3

Given that you have a folder called images with files P1.jpg, P2.jpg and P3.jpg under your ContentRooPath.

https://learn.microsoft.com/en-us/aspnet/core/fundamentals/host/web-host?view=aspnetcore-3.0

Is in base64 encoding :) you just need to convert back to byte array https://stackoverflow.com/questions/6733845/c-sharp-convert-a-base64-byte — Mauricio Atanache, Oct 23 '19 at 01:51

score 0 · Answer 2 · answered Oct 17 '19 at 19:52

You'll need something in the response to delimit where each image starts and finishes. As a basic solution, you could write the image length as an Int32 and follow it with the image data. On the other end, you'll need to read the 4-byte length followed by that x number of bytes:

[HttpGet]
public HttpResponseMessage Get(string id)
{
    var result = new HttpResponseMessage(HttpStatusCode.OK);
    String[] strArray = id.Split(',');

    var ms = new MemoryStream();
    for (int i = 0; i < strArray.Length; i++)
    {
        String filePath = HostingEnvironment.MapPath("~/Fotos/Empresas/Comer/" + strArray[i] + (i + 1) + ".jpg");

        byte[] bytes = File.ReadAllBytes(filePath);
        byte[] length = BitConverter.GetBytes(bytes.Length);

        // Write length followed by file bytes to stream
        ms.Write(length, 0, 4);
        ms.Write(bytes, 0, bytes.Length);
    }

    result.Content = new StreamContent(ms);

    return result;
}

in debbug i see getting all bytes but when i open in IIS show nothing, in that case it's normal because i just had the bytes, and in my case i just need to convert the bytes to image from result in my xamarin right? — DevYuri, Oct 18 '19 at 14:02
That’s right — if you try and open the image in a browser, it won’t show. — joehoper, Oct 18 '19 at 16:17

MVC WebAPI return multiple images

2 Answers2