web-dev-qa-db-ja.com

バイト配列を画像に変換し、Razorビューで表示する

EF 4.1 Code Firstを使用しています。簡単にするために、次のEntityクラスがあるとします。

public class Person
{
    public int Id { get; set; }
    public string Name { get; set; }
    public Byte[] Image { get; set; }
}

データベースへのPersonオブジェクトの追加を許可する作業ビューを作成することができました。

しかし、人の詳細を表示するようになったとき、私はImageの表示にこだわっています。 Googleを長時間検索した結果、次のことがわかりました。

// To convert the Byte Array to the author Image
public FileContentResult getImg(int id)
{
    byte[] byteArray = DbContext.Persons.Find(id).Image;
    return byteArray != null 
        ? new FileContentResult(byteArray, "image/jpeg") 
        : null;
}

そして、個人の詳細を一覧表示しようとしているビューでは、画像を表示するために次のものがあります。

<img src="@Html.Action("getImg", "Person", new { id = item.Id })" alt="Person Image" />

ただし、上記は動作していないであり、画像ソース[src]属性は空を返しますです。

私は画像を表示するのに役立つに感謝します。

ありがとうございました。

シワン。

asp.net-mvcimageasp.net-mvc-3razorbytearray
38
J86

このような：

<img src="@Url.Action("getImg", "Person", new { id = item.Id })" alt="Person Image" />

GetImgアクションのURLを生成したいだけなので、Url.ActionではなくHtml.Actionが必要です。 Html.Actionは何かを行います 完全に異なる 。

36
Darin Dimitrov

モデルに既にイメージがロードされている場合、これを行うさらに簡単な方法があります。

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

この方法を使用すると、イメージを取得するためだけにサーバーに再度アクセスする必要はありませんbyte[]実行中のデータベースから。

59
Leniel Maccaferri

Razor MVCページのModelプロパティから動的にロードされたSVG画像を表示する最良の方法は、.ToHTMLString（）と組み合わせてHtml.DisplayFor（..）を使用することであることがわかりました。私の場合、Imageというモデルプロパティに格納されたベース64 SVG Image + XMLデータ文字列があります。ここに私のコードがあります：

<img src='@Html.DisplayFor(model => model.Image).ToHtmlString()' />

これは、Chrome、FireFox、およびIEでSVG画像を適切に表示できる唯一の方法のように思えました。

乾杯

0
sondlerd