如何使用HtmlHelper类 – ASP.NET MVC显示图像
我目前仍然坚持使用HtmlHelper类显示图像的问题。
这就是我所拥有的。
我有一个自定义的HtmlHelper类，它应该显示一个图像：
public static string Images(this HtmlHelper helper, ......){ var writer = new HtmlTextWriter(new StringWriter()); byte[] bytearray = ... // some image byte array retrieved from an object. // begin html image tag - this is where the problem is writer.AddAttribute(HtmlTextWriterAttribute.Src, url.Action("GetPhoto", "Clinical", new { image = bytearray })); writer.RenderBeginTag(HtmlTextWriterTag.Img); writer.RenderEndTag(); // end of image tag return writer.InnerWriter.ToString(); } 所以我上面尝试做的是将一个Url.Action注入img源属性。
我有一个控制器“GetPhoto”，支持处理该bytearray并返回一个图像。
public FileContentResult GetPhoto(byte[] image) { return File(image, "image/jpeg"); }
我设法进入控制器，但图像显示为null。 有办法解决吗？ 或者更好的方法呢？ 非常感谢您的帮助，谢谢！
控制器操作存在一些问题。 它希望将图像作为字节数组传递。 在你的助手类中，你试图生成一个指向这个控制器动作的img标签并传递一个字节数组，但这不起作用，因为你不能使用GET请求传递字节数组。 您需要更改此控制器操作，以便不是接受字节数组，而是采用一些标识符，允许您获取图像并将其写入输出流。 然后你的html助手会在生成img标签时传递这个标识符。
public FileContentResult GetPhoto(string imageId) { byte[] image = _repository.GetPhoto(imageId); return File(image, "image/jpeg"); }
你的助手：
public static string Images(this HtmlHelper htmlHelper, string id,string alt) { var urlHelper = ((Controller)htmlHelper.ViewContext.Controller).Url; var photoUrl = urlHelper.Action("GetPhoto", "Clinical", new { imageId = id }); var img = new TagBuilder("img"); img.MergeAttribute("src", photoUrl); img.MergeAttribute("alt", alt); return img.ToString(TagRenderMode.SelfClosing); }
哪个可以在您的视图中使用：
<%= Html.Images("123") %>
当您将图像标记渲染到您正在执行的页面上时，渲染图像“标记”，换句话说，引用位于其他位置的图像的标记，例如：
所以我不确定你为什么直接在Image Helper中处理一个bytearray。 您是否期望将图像的字节直接呈现到HTML标记中，如下所示：
如果是这样，那就不是它的工作方式*。 想想看，如果你有一个1MB的图像，那么你的浏览器必须下载和处理1MB以上的HTML文档，这会大大减慢页面速度。 当图像是外部引用时，如第一个示例，那么浏览器可以更有效地处理页面，首先呈现HTML然后抓取外部图像。 当图像是外部文件时，您还可以获得浏览器缓存的好处。
您的图像需要存储在其他地方，例如。 作为webapp中某个文件夹中的文件。 然后将图像的URL传递给ViewModel（以及视图），而不是原始图像数据本身。 例如。
public static string Image(this HtmlHelper helper, string url) { var writer = new HtmlTextWriter(new StringWriter()); writer.AddAttribute(HtmlTextWriterAttribute.Src, url); writer.RenderBeginTag(HtmlTextWriterTag.Img); writer.RenderEndTag(); return writer.InnerWriter.ToString(); }
和你的ViewModel ……
public class Product { public string Title { get; set; } public string Description { get; set; } public string ImageUrl { get; set } }
和你的aspx查看……
<%= Html.Encode(Model.Title) %>
<%= Html.Image(Model.ImageUrl) %> <%= Html.Encode(Model.Description) %>
*从技术上讲，可以使用一种称为数据URI方案的方法来实现这一点，但它并没有得到广泛的支持，在这种情况下不建议在任何地方使用。 它真的意味着非常小的图像，或者通过JavaScript动态显示图像（例如从canvas中抓取的图像数据）。