Asp.net MVC4與Razor呈現圖片的擴展

        我們基於Asp.net MVC 4 Web Application 寫一個擴展方法來呈現圖片的擴展。Gravatar是提供個人Profile信息的網站，包括圖片LOGO。你可以引用你的Profile到論壇，Blog都可以。
        一開始我們寫一個Helper如下:

namespace MVC4Demo.Extensions
{
    using System;
    using System.Web.Mvc;
    using System.Web.Security;

    public static class GravatarHtmlHelperExtensions
    {
        /// <summary>
        /// Gets the Gravatar image URL.
        /// </summary>
        /// <param name="emailId">The email id.</param>
        /// <param name="imgSize">Size of the img.</param>
        /// <seealso cref="https://en.gravatar.com/"/>
        /// <returns>Image MvcHtmlString</returns>
        public static MvcHtmlString RenderGravatarImage(this HtmlHelper helper, string emailId, int imgSize)
        {
            if (string.IsNullOrEmpty(emailId))
                throw new ArgumentNullException("Email Id should not be null!");

            // Convert emailID to lower-case
            emailId = emailId.ToLower();

            string hash = FormsAuthentication.HashPasswordForStoringInConfigFile(emailId, "MD5").ToLower();

            // build Gravatar Image URL
            string imageUrl = string.Format(@"<img src=""http://www.gravatar.com/avatar/{0}?s={1}&d=mm&r=g"" />", hash, imgSize);

            return new MvcHtmlString(imageUrl);
        }
    }
}

接在Razor的Web.config中加入相應的Namespace:

  <system.web.webPages.razor>
    <host factoryType="System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
    <pages pageBaseType="System.Web.Mvc.WebViewPage">
      <namespaces>
        <add namespace="System.Web.Mvc" />
        <add namespace="System.Web.Mvc.Ajax" />
        <add namespace="System.Web.Mvc.Html" />
        <add namespace="System.Web.Optimization"/>
        <add namespace="System.Web.Routing" />
        <add namespace="MVC4Demo.Extensions"/>
      </namespaces>
    </pages>
  </system.web.webPages.razor>

然后在頁面cshtml上我們可以這樣使用了:

<div class="Author" style="position:relative;">
<div style="position:absolute; top:10px;">
 @Html.RenderGravatarImage(Model.AuthorEmail, 100)
</div>

如果您對Asp.net MVC 4 Web Application有一定了解，上面的代碼並不難懂，這里也只是非常簡單的一個示例。希望對您開發有幫助。

您可能感興趣的文章：

Asp.net MVC3擴展之Ajax異常處理特性

作者：Petter Liu
出處：http://www.cnblogs.com/wintersun/
本文版權歸作者和博客園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連接，否則保留追究法律責任的權利。
該文章也同時發布在我的獨立博客中-Petter Liu Blog。