在MVC 4（Razor）应用程序的所有页面中显示用户图像（如果已认证）

Question

我想在我的应用程序的所有页面上显示已登录用户的图像。我已成功地为用户详细信息创建了CRUD，但还想在所有页面上显示名称和其图片。我只能检索到名称。

我该如何检索图像呢？

_LoginPartial.cshtml:

@if (Request.IsAuthenticated)
{
    Convert.ToString(ViewBag.EmployeeName);

    <text> Hello, @Html.ActionLink(User.Identity.Name, "Manage", "Account",routeValues: null, htmlAttributes: new { @class = "username", title = "Manage" })
    @using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm" }))
    {
        @Html.AntiForgeryToken()
        <a href="javascript:document.getElementById('logoutForm').submit()">Log off</a>
    }
    </text>
}
else
{
    <ul>
    <li>@Html.ActionLink("Log in", "Login", "Account", routeValues: null, htmlAttributes: new { id = "loginLink" })
    </li>
    </ul>
}

注意:

我正在使用asp.net MVC 4（Entity Framework）。

- Affan Shahab

Answer 1

你需要为此编写一个辅助类，我将告诉你如何为Gravatar图像执行此操作： 添加一个名为GravatarOptions的类：

public class GravatarOptions
{
    public string DefaultImageType { get; set; }
    public string RatingLevel { get; set; }
    public int Size { get; set; }
    public string CssClass { get; set; }

    public class DefaultImage
    {
        public const string Default = "";
        public const string Http404 = "404";
        public const string MysteryMan = "mm";
        public const string Identicon = "identicon";
        public const string MonsterId = "monsterid";
        public const string Wavatar = "wavatar";
        public const string Retro = "retro";
    }

    public class Rating
    {
        public const string G = "g";
        public const string PG = "pg";
        public const string R = "r";
        public const string X = "x";
    }


    internal static GravatarOptions GetDefaults()
    {
        return new GravatarOptions
        {
            DefaultImageType = GravatarOptions.DefaultImage.Retro,
            Size = 150,
            RatingLevel = GravatarOptions.Rating.G
        };
    }
}

添加一个名为GravatarHelper的类：

public static class GravatarHelper
{
    public static HtmlString GravatarImage(this HtmlHelper htmlHelper, string emailAddress, GravatarOptions options = null)
    {
        if (options == null)
            options = GravatarOptions.GetDefaults();

        var imgTag = new TagBuilder("img");

        emailAddress = string.IsNullOrEmpty(emailAddress) ? string.Empty : emailAddress.Trim().ToLower();

        if (!string.IsNullOrEmpty(options.CssClass))
        {
            imgTag.AddCssClass(options.CssClass);
        }

        imgTag.Attributes.Add("src", string.Format("http://www.gravatar.com/avatar/{0}?s={1}{2}{3}",
        GetMd5Hash(emailAddress),
            options.Size,
            "&d=" + options.DefaultImageType,
            "&r=" + options.RatingLevel
            )
        );

        return new HtmlString(imgTag.ToString(TagRenderMode.SelfClosing));
    }

    // Source: http://msdn.microsoft.com/en-us/library/system.security.cryptography.md5.aspx
    private static string GetMd5Hash(string input)
    {
        byte[] data = MD5.Create().ComputeHash(Encoding.UTF8.GetBytes(input));
        var sBuilder = new StringBuilder();
        for (int i = 0; i < data.Length; i++)
        {
            sBuilder.Append(data[i].ToString("x2"));
        }
        return sBuilder.ToString();
    }
}

将以下内容添加到Bootstrap CSS文件中：

.navbar-image {
  float: left;
  padding: 10px 5px;
}

修改您的_LoginPartial.cshtml:

using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" }))
{

@Html.AntiForgeryToken()

<div class="navbar-image">
    @Html.GravatarImage(User.Identity.GetUserName();, new GravatarOptions { Size = 30, CssClass = "img-circle" })
</div>

<ul class="nav navbar-nav navbar-right">
    <li>
        @Html.ActionLink("Hello " + User.Identity.GetUserName(); + "!", "Manage", "Account", routeValues: null, htmlAttributes: new { title = "Manage" })
    </li>
    <li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li>
</ul>
}

_{链接但是如果你完成了整个30天的话，这可能会有些意义 :P}

- Syed Farjad Zia Zaidi

---

有没有想法如何将这个更新为.NET Core ASP 3.1？它是一个优雅的解决方案，但抱怨它不是IHtml Dynamic的一部分。 - c-sharp-and-swiftui-devni

嗨@rogue39nin，我回答这个问题已经有一段时间了，但我可以为您查看。虽然我需要设置它，可能需要一些时间才能回复您。 - Syed Farjad Zia Zaidi

没事，我明白了。我想要的是人名缩写，但这个更符合我的需求，虽然有些复杂。 - c-sharp-and-swiftui-devni