如何在identityServer3登錄頁面中創建驗證碼

Question

我想在我的登錄頁面使用驗證碼身份驗證服務器3中的頁面，我該怎麼做？ 有沒有樣品來源？ 我嘗試使用Google reCaptcha，但它不起作用。 請幫我

Answer 1

更好的問題是how to customize the login screen? 看到the documentation on customizing views

在IdentityServer的意見，可以通過以下兩種方式之一進行定製：1） 定製由DefaultViewService提供的HTML模板，或者如果 更多的控制，需要2）定義定製IViewService

實現自定義IViewService到change the full layout。 此外，如果您只想更改登錄頁面，請添加您的自定義html，其實現與existing login page相同的角度邏輯，並將其添加到名爲templates的文件夾中，文件名爲_login.html。 如果要修改layout（標題），那麼此時需要執行相同的操作，命名文件_Layout.html。 這全部在documentation中展示，上面列爲「替換部分視圖」。

Answer 2

這是我做到了，而無需使用IViewService

添加驗證碼腳本模板/ _layout.html頭標記

<script src='https://www.google.com/recaptcha/api.js'></script> 

添加片斷登錄在模板/ _login.html屏幕頁面，用加入名稱= 「G-驗證碼 - 響應」 屬性

<div class="g-recaptcha" name="g-recaptcha-response" data-sitekey="your sitekey"></div> 

添加CspOptions噸Ø啓動類，允許谷歌腳本

CspOptions = new CspOptions 
{ 
    Enabled = true, 
    FontSrc = "'self' data: fonts.gstatic.com", 
    StyleSrc = "'self' 'unsafe-inline' fonts.googleapis.com", 
    ScriptSrc = "'self' https://www.google.com https://www.gstatic.com; object-src 'self'", 
    FrameSrc = "https://www.google.com" 
} 

進樣OwinEnvironmentService一個到UserService類 - 這將讓您抓住從驗證碼片斷

private readonly OwinEnvironmentService _environmentService; 

public UserService(OwinEnvironmentService environmentService) 
{ 
    _environmentService = environmentService; 
} 

在AuthenticateLocalAsync令牌，搶令牌和驗證

var gReCaptchaResponse = _environmentService.GetLoginInput("g-recaptcha-response"); 
var client = new RestClient("https://www.google.com"); 
var request = new RestRequest("recaptcha/api/siteverify", Method.POST) { RequestFormat = DataFormat.Json }; 
request.AddParameter("secret", "YOUR SECRET"); 
request.AddParameter("response", gReCaptchaResponse); 
var response = client.Execute(request); 
var verficationStatus = JsonConvert.DeserializeObject<GReCaptcha>(response.Content); 

if(!verficationStatus.Success) 
{ 
    Logger.Warn("Captcha invalid"); 
    context.AuthenticateResult = new AuthenticateResult("Please verify that you are not a robot"); 
    return Task.FromResult(0); 
} 

GetLoginInput（形式輸入名稱）擴展 （credit to martinip86 from Github

public static string GetLoginInput(this OwinEnvironmentService environmentService, string fieldName) 
{ 
    const string body = "owin.RequestBody"; 
    if (!environmentService.Environment.Keys.Contains(body)) 
     return null; 

    var owinFormData = environmentService.Environment[body] as System.IO.Stream; 
    if (owinFormData == null) 
     return null; 

    var formData = string.Empty; 
    using (var sr = new System.IO.StreamReader(owinFormData)) 
    { 
     formData = sr.ReadToEnd(); 
    } 

    if (string.IsNullOrWhiteSpace(formData)) 
     return null; 

    var formDataParsed = HttpUtility.ParseQueryString(formData); 
    return formDataParsed[fieldName]; 
}