Отобразите изображение, содержащееся в байте [], с помощью ASP.Net MVC3

У меня взгляд с сильным типом. Этот сильный тип имеет поле, состоящее из byte[], этот массив содержит картинку.

Можно ли отобразить это изображение с помощью чего-то вроде @Html.Image(Model.myImage)?

Большое Вам спасибо


person J4N    schedule 18.05.2011    source источник


Ответы (6)


Вы можете создать метод действия контроллера, который возвращает изображение как FileContentResult:

public FileContentResult Display(string id) {
   byte[] byteArray = GetImageFromDB(id);
   return new FileContentResult(byteArray, "image/jpeg");
}

Затем вы можете создать ActionLink для метода действия в представлении, используя идентификатор изображения из модели.

person Dmitry S.    schedule 18.05.2011
comment
Это именно то, что мне было нужно, но я использовал новый File(...), а не FileContentResult - person J4N; 19.05.2011
comment
@ J4N, что вы подразумеваете под использованием нового файла (...)? - person Elan Hasson; 03.10.2011
comment
Вы можете использовать метод контроллера File(...), но нет нового - person Dmitry S.; 19.06.2012
comment
Примечание: для изображения любого размера вы хотели бы сделать это с помощью потокового API, откладывая итерацию (через умеренный буфер) до ActionResult. - person Marc Gravell; 31.08.2012
comment
@DmitryStarosta Можем ли мы тогда строго ввести View в объект FileContentResult? - person Mike Marks; 06.05.2013
comment
Объект ViewResult — единственный, для которого требуется представление Razor/ASPX. Другие объекты результатов действий, такие как FileContentResult или JsonResult, не нуждаются в представлении. - person Dmitry S.; 06.05.2013

Это зависит от размера изображения. Если он небольшой, вы можете написать что-нибудь, чтобы закодировать его в base-64 и встроить в html, как любой из них.

конкретный пример отсюда< /а>:

<img src="data:image/gif;base64,R0lGODlhUAAPAKIAAAsLav///88PD9WqsYmApmZmZtZfYmdakyH5BAQUAP8ALAAAAABQAA8AAAPbWLrc/jDKSVe4OOvNu/9gqARDSRBHegyGMahqO4R0bQcjIQ8E4BMCQc930JluyGRmdAAcdiigMLVrApTYWy5FKM1IQe+Mp+L4rphz+qIOBAUYeCY4p2tGrJZeH9y79mZsawFoaIRxF3JyiYxuHiMGb5KTkpFvZj4ZbYeCiXaOiKBwnxh4fnt9e3ktgZyHhrChinONs3cFAShFF2JhvCZlG5uchYNun5eedRxMAF15XEFRXgZWWdciuM8GCmdSQ84lLQfY5R14wDB5Lyon4ubwS7jx9NcV9/j5+g4JADs=" alt="British Blog Directory" width="80" height="15">

Если изображение имеет заметный размер, вы можете вместо этого написать маршрут, который позволяет выполнять поиск по некоторому ключу к изображению, то есть маршрут наподобие /images/{id} — в этом маршруте вы извлекаете двоичный файл изображения и используете return File(bytes, contentType), дополнительно установив заголовки кэширования (и не забудьте перепроверить всю необходимую безопасность). В вашем html у вас будет просто

<img src="/images/@imageId" ... />

(используя синтаксис бритвы, но аналогичный для aspx).

Подход с отдельным маршрутом требует дополнительного перехода к серверу, но позволяет кэшировать на клиенте (подход с встроенным base-64 помещает данные в каждый запрос).

person Marc Gravell    schedule 18.05.2011
comment
Хорошая реализация этого содержится в коде ASP.Net Sprite и Image Optimization Framework (aspnet .codeplex.com/releases/view/65787) - person Elan Hasson; 03.10.2011
comment
Большое спасибо! Для меня это было замечательно, потому что у меня было готовое изображение на лету, и я хотел показать его в виде ajax. Через несколько часов, наконец, ваше предложение решило мою проблему! - person ghedas; 24.12.2011
comment
О подходе Route мы можем прочитать здесь dotnetslackers.com/articles/aspnet/ - person DmitryBoyko; 31.08.2012

Если у вас уже есть изображение, загруженное в вашу модель в виде массива byte[], вы можете сделать это, как упоминает @Marc Gravell в своем ответе:< /а>

<img src="data:image;base64,@System.Convert.ToBase64String(Model.Photo)" />

Это значительно упрощает весь процесс, и вам не нужно будет иметь определенный метод действия FileContentResult и снова обращаться к базе данных (см. ответ @Dmitry S ) только для того, чтобы получить этот массив byte[] с вашим изображением/фотографией, так как он уже загружен в вашу модель.

person Leniel Maccaferri    schedule 27.09.2013

Похоже, вам понадобится новое действие, которое получает массив байтов (из базы данных?) и возвращает изображение через Файл метод....

Затем сгенерируйте привязку, указывающую на это действие, чтобы изображение могло загружаться во время загрузки страницы, ускоряя отображение.

person Kieron    schedule 18.05.2011

Посмотрите на класс WebImage.

http://msdn.microsoft.com/en-us/library/system.web.helpers.webimage(v=vs.99).aspx

person Elan Hasson    schedule 12.09.2011

Я бы разработал простой универсальный обработчик для обслуживания ваших изображений. Этот обработчик мог бы с заданным параметром загружать изображения из базы данных и записывать их в поток вывода http.

public class UserImage : IHttpHandler
{
    public bool IsReusable
    {
        get { return false; }
    }

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "image/jpeg";

        // Get the stream from the database
        var image = System.Drawing.Image.FromStream(stream);

        image.Save(context.Response.OutputStream, ImageFormat.Jpeg);
    }
}
person DEHAAS    schedule 18.05.2011
comment
Нет смысла загружать и сохранять изображение. Вы должны просто отправить исходный поток. - person SLaks; 18.05.2011