將圖形添加到ASP.NET MVC上的OpenID登錄按鈕示例

我正在使用VS 2012 MVC4（剃鬚刀）示例（幾乎全部是新的），並且修改了AuthConfig.cs文件以允許OpenID訪問谷歌和雅虎將圖形添加到ASP.NET MVC上的OpenID登錄按鈕示例

 OAuthWebSecurity.RegisterGoogleClient(); 
     OAuthWebSecurity.RegisterYahooClient();

果然，這兩個OpenID選項被介紹。我想修改它以便按鈕顯示相應的徽標。

DotNetOpenAuth有一種返回圖像路徑的方法嗎？我想如果它確實如此，我可以修改ExternalLogin「頁面」。

@foreach (AuthenticationClientData p in Model) 
{ 
     <button type="submit" name="provider" value="@p.AuthenticationClient.ProviderName" title="Log in using your @p.DisplayName account"><img src="" />@p.DisplayName </button>    
}

來源

2013-01-04 WhiskerBiscuit

爲什麼不將徽標保存爲圖像文件夾中的本地資源，將它們命名爲每個OAuth提供程序的DisplayName。然後你可以使用 – Tommy

這些按鈕本身並不是dotnetopenauth的一個特性，它在按鈕的行爲下面使用。 –

你可以做這樣的（對不起它的vb.net代碼）：

在AuthConfig RegisterAuth方法創建一個dictionnary和你的圖標路徑添加到所需的圖像

Dim MsExtraData As New Dictionary(Of String, Object) 
MsExtraData.Add("Icon", VirtualPathUtility.ToAbsolute("~/Images/Microsoft.png")) 

' Then pass it as extraData parameter to the register client method 
OAuthWebSecurity.RegisterMicrosoftClient(
     clientId:="yourkey", 
     clientSecret:="yoursecret", 
     displayName:="Microsoft", 
     extraData:=MsExtraData)

現在查看Views \ Account文件夾中的_ExternalLoginsListPartial文件夾，並用此更改按鈕生成代碼：

<button type="submit" id="<%: p.DisplayName%>" name="provider" value="<%: p.AuthenticationClient.ProviderName%>" title="Login with <%: p.DisplayName %>"><%: p.DisplayName%> 
      <img src="<%: p.ExtraData("Icon")%>" alt="Icon for <%: p.DisplayName%>" /> 
     </button>

來源

2013-01-13 06:16:57 user1973618

聽起來不錯。 Twitter和Facebook簽名需要額外的字段：displayName。

來源

2013-03-13 18:26:40 MBC

我只是用字體要命做任務的_ExternalLoginsListPartials查看像這樣：

 using (Html.BeginForm(Model.Action, "Account", new { ReturnUrl = Model.ReturnUrl })) 
 
     { 
 
      @Html.AntiForgeryToken() 
 
      <div id="socialLoginList"> 
 
       <p> 
 
       @foreach (AuthenticationDescription p in loginProviders) 
 
       { 
 
        <button type="submit" class="btn btn-default" id="@p.AuthenticationType" name="provider" value="@p.AuthenticationType" title="Log in using your @p.Caption account"><span class="fa [email protected]()">&nbsp;&nbsp;</span>@p.AuthenticationType</button> 
 
       } 
 
       </p> 
 
      </div> 
 
     }

這關當然前提是你使用的字體，要命的，但我認爲這也將與其他glyphicons一起工作。此外，這是MVC5和VS2013，但我想它仍然適用於以前的MVC版本，因爲我只使用html，css和Razor。

希望有幫助！

來源

2014-10-09 19:45:55

將圖形添加到ASP.NET MVC上的OpenID登錄按鈕示例

回答

相關問題