reCAPTCHA

29.06.2018 von robert@riwa4.de
/blog/artikel/recaptcha

reCAPTCHA Dokumentation

Um zu verhindern, dass trollende Roboter Eingaben auf einer Web-Seite machen, gibt es schon lange die sog. Captchas um Roboter von Menschen zu unterscheiden. Dazu müssen meistens Buchstaben oder Zahlen in einem Textfeld erkannt werden - für den Benutzer ist das mehr als nervig. 

reCAPTCHAs Idee war, die Zeit und Energie, die die Nutzer dafür verwenden auch für sinnvolle Dinge zu nutzen. Die Firma wurde mittlerweile von Google übernommen und der Fokus wurde etwas verändert: Es wird weitgehend automatisch erkannt, ob wirklich ein Mensch die Web-Seite betätigt oder nicht und nur in Ausnahmefällen müssen noch Aufgaben bei der Eingabe gelöst werden, wie z.B. das Erkennen von Verkehrszeichen. Ich habe den Einbau des Dienstes jetzt einmal ausprobiert.

English Français Espagnol Portuguese

Die Doku ist etwas spärlich, aber im Grunde ist es einfach. Ich habe das zunächst bei einer internen Testseite eingebaut und sobald ich es brauche, kann ich das leicht aktivieren. Zur Hilfe gibt es auch ein fertiges NuGET-Paket für ASP.NET Core, das man verwenden kann. Eigentlich trivial, aber trotzdem hilfreich zu sehen, wie es gemacht wird:

Die Konfiguration erfolgt in einer eigenen Section, damit man nicht überall den Sitekey manuell einfügt. Damit die Optionen in einer Razor-Page verfügbar sind, ruft man in Startup die Konfiguration auf:

services.Configure<RecaptchaSettings>(Configuration.GetSection("RecaptchaSettings"));
services.AddTransient<IRecaptchaService, RecaptchaService>();

Und in der Seite:

@inject IOptions<RecaptchaSettings> RecaptchaSettings

Dann kann man das Captcha so einfügen:

<div class="g-recaptcha" data-sitekey="@RecaptchaSettings.Value.SiteKey"></div>

Man kann dann einfach mit @RecaptchaSettings.Value.SiteKey den Sitekey referenzieren. Und in der Razor-Page lässt man sich per Dependency Injection die Schnittstelle IRecaptchaService geben, die die Funktion Validate zur Verfügung stellt. Diese ruft man auf, um den Aufruf zu validieren.

Das sieht dann folgendermaßen aus:

        public async Task<IActionResult> OnPostAsync()
{
bool captchaValid = await _recaptcha.Validate(Request);
if (!captchaValid)
{
ModelState.AddModelError("reCaptcha", "Bitte das reCaptcha bestätigen.");
}
if (ModelState.IsValid)
{
return Page();
}
else
{
ViewData["Message"] = "Schiefgegangen";
return Page();
}
}