web-dev-qa-db-fra.com

Conversion de tableau d'octets en image et affichage en mode Razor

J'utilise EF 4.1 Code First et, dans un souci de simplicité, supposons que j'ai la classe d'entité suivante:

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

J'ai réussi à créer une vue Créer active qui permet l'ajout d'un objet Personne à la base de données.

Mais quand je viens d'afficher les détails d'une personne, je reste bloqué à l'affichage de l'image. Après plusieurs heures de recherche sur Google, j'ai les informations suivantes:

// 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;
}

Et dans la vue où je tente de répertorier les détails de la personne, je dispose des éléments suivants pour afficher l'image:

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

Cependant, ce qui précède est ne fonctionne pas, mon attribut image source [src] renvoie empty.

Je voudrais j'apprécie beaucoup votre aide pour que mes images s'affichent.

Je vous remercie.

Ciwan.

37
J86

Comme ça:

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

Vous avez besoin de Url.Action et non de Html.Action car vous voulez simplement générer une URL pour l'action GetImg. Html.Action fait quelque chose entièrement différent .

35
Darin Dimitrov

Il existe un moyen encore plus simple de procéder si vous avez déjà chargé l'image dans votre modèle:

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

De cette façon, vous n'avez pas besoin de vous rendre au serveur pour récupérer l'image byte[] de la base de données comme vous le faites.

58
Leniel Maccaferri

J'ai constaté que le meilleur moyen d'afficher une image SVG chargée dynamiquement à partir d'une propriété Model dans une page Razor MVC est d'utiliser Html.DisplayFor (..) en combinaison avec .ToHTMLString (). Dans mon cas, une chaîne de données SVG Image + XML de base 64 est stockée dans la propriété du modèle nommée Image. Voici mon code:

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

Cela semblait être le seul moyen pour moi de pouvoir afficher correctement l'image SVG dans Chrome, FireFox et IE.

À votre santé

0
sondlerd