使用SimpleMember,您可以向外部身份验证提供程序按钮添加图标,如下所示:
简单会员:
Dictionary<string, object> FacebooksocialData = new Dictionary<string, object>();
FacebooksocialData.Add("Icon", "/content/images/gui/loginFacebook.png");
OAuthWebSecurity.RegisterFacebookClient(
appId: "x",
appSecret: "x",
displayName: "Facebook",
extraData: FacebooksocialData);
然后在视图中像这样显示它们:
@foreach (AuthenticationClientData p in Model)
{
<button class="externalLoginService" style="cursor:pointer;color:transparent;border:none;background:url(@p.ExtraData["Icon"]);width:94px;height:93px;margin-right:20px;" type="submit" name="provider" value="@p.AuthenticationClient.ProviderName" title="Log in with @p.DisplayName">@p.DisplayName</button>
}
ASP.NET 身份(?
app.UseFacebookAuthentication(
appId: "x",
appSecret: "x");
如何使用 ASP.NET 身份(控制器和视图)实现相同的目标?
另一种方法:
拿走了这个博客中的一些内容(使用zocial图标,但我发现这些图标是矫枉过正的 - 请参阅css文件,你会明白我的意思):http://www.beabigrockstar.com/pretty-social-login-buttons-for-asp-net-mvc-5/
并这样做:
Startup.Auth.cs
(没有多余的东西,只是来自MVC 5应用程序的标准默认内容)
app.UseFacebookAuthentication(appId: "x", appSecret: "x");
app.UseGoogleAuthentication();
.CSS:
.socialLoginButton {
cursor:pointer;color:transparent;border:none;width:94px;height:93px;margin-right:20px;
}
.socialLoginButton.facebook {
background:url(/content/images/gui/loginFacebook.png);
}
.socialLoginButton.google {
background:url(/content/images/gui/loginGoogle.png);
}
视图:
<button type="submit" class="externalLoginService socialLoginButton @p.AuthenticationType.ToLower()" id="@p.AuthenticationType" name="provider" value="@p.AuthenticationType" title="Log in with @p.Caption">@p.AuthenticationType</button>
在上面的其他解决方案/答案中使用类而不是不太优雅的样式属性。
您仍然可以执行类似操作,基本上在 Startup.Auth 中.cs当您启用身份验证提供程序时,您需要向身份验证描述添加额外的数据:
var desc = new AuthenticationDescription();
desc.Caption = "Google";
desc.AuthenticationType = "Google";
desc.Properties["Img"] = "<img>";
app.UseGoogleAuthentication(new GoogleAuthenticationOptions() { Description = desc });
然后在按钮中使用 @p.Properties["Img"],就像您之前在_ExternalLoginListPartial视图中所做的那样
<legend>Use another service to log in.</legend>
<p>
@foreach (AuthenticationDescription p in loginProviders) {
<button type="submit" class="btn" id="@p.AuthenticationType" name="provider" value="@p.AuthenticationType" title="Log in using your @p.Caption account">@p.AuthenticationType</button>
}
</p>