How to display pictures (array of bytes) in a view ( <img> )?

Suppose there is a controller, in it I receive from the database an array of bytes-image. How can I display these pictures in the view. I will be glad to hear all possible options.

  • It depends on how the original image was converted to an array of bytes. - Alexander Petrov

2 answers 2

Vitaly’s work option, but I suggest not fooling around with base64 encoding - but immediately send the picture:

 [HttpGet] public async Task<IActionResult> Get() { var image = System.IO.File.OpenRead("C:\\images\\myImage.jpeg"); // Или из базы, но я предпочитаю не грузить в БД картинки return File(image, "image/jpeg"); }

And use this url as a usual src image - using Url.Action or whatever version of mvc you have there.

 <img src='@Url.Action(actionaname","controller")'>

In reality, this will of course be an action with the id parameter of the image or its name.

There are no differences in approaches, well, except that in base64 the traffic will be ~ 30% higher than if transmitting a sequence of bytes. How critical it is with your volume of picture traffic - decide for yourself.

Related Links:

  • but it is more convenient for me to store in the database) But thanks anyway for your answer) - LORD
 using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; namespace DemoProject.Controllers { public class DemoController : Controller { // GET: Demo/GetImageFromByteArray public ActionResult GetImageFromByteArray() { // Конвертируем string imreBase64Data = Convert.ToBase64String(byteData); string imgDataURL = string.Format("data:image/png;base64,{0}", imreBase64Data); //Передаем во вью ViewBag.ImageData = imgDataURL; return View(); } } } @{ ViewBag.Title = "Asp.Net MVC Display image from byte array"; } <h2>Asp.Net MVC Display image from byte array</h2> <img src="@ViewBag.ImageData">