Home-theater-designers
Da Web- und mobile Anwendungen immer beliebter werden, steigt auch das Risiko von Spam und anderen böswilligen Aktivitäten. CAPTCHAs können eine praktische Sicherheitsmaßnahme sein, die es wert ist, integriert zu werden, um diese Art von Sicherheitsbedrohungen zu verhindern.
Ein CAPTCHA ist eine minimale Sicherheitsfunktion, die üblicherweise in Webformulare integriert wird, um automatisierte Angriffe durch Spambots zu verhindern. Es stellt sicher, dass der Benutzer, der auf eine Anwendung zugreift, tatsächlich ein Mensch ist und kein Bot, der schädlichen Code ausführt.
Was ist CAPTCHA?
Das Akronym CAPTCHA steht für Completely Automated Public Turing test to tell Computers and Humans Apart. Es bezieht sich auf einen computergenerierten Test, der überprüft, ob ein bestimmter Benutzer, der mit Ihrer Anwendung interagiert, ein Mensch und kein Bot ist.
Warum sind meine Laptop-Fans so laut?
Es gibt verschiedene Arten von CAPTCHA-Tests, die Sie in Ihre Anwendung integrieren können, z. B. textbasierte und audiobasierte CAPTCHAs. Der beliebteste und effektivste Typ ist jedoch Google reCAPTCHA. Es prüft, ob echte Benutzer und Bots mithilfe fortschrittlicher Risikoanalysealgorithmen unterschieden werden können.
Warum lässt sich mein Tablet nicht einschalten?
Google reCAPTCHA gibt es in zwei Versionen:
- reCAPTCHA V3: Diese Version läuft im Hintergrund und ermittelt anhand des Nutzerverhaltens eine Gesamtpunktzahl.
- reCAPTCHA V2: Diese Version platziert das Kontrollkästchen „Ich bin kein Roboter“ auf dem Authentifizierungsformular.
In diesem Leitfaden wird Google reCAPTCHA V2 untersucht. Lesen Sie weiter, um zu erfahren, wie Sie es in eine React-Anwendung integrieren können.
Registrieren Sie die React-Anwendung in der reCAPTCHA-Verwaltungskonsole
Um zu beginnen, müssen Sie Ihre Anwendung in der Entwicklerkonsole von reCAPTCHA registrieren. Geh 'rüber zu Die reCAPTCHA-Verwaltungskonsole von Google , Melden Sie sich mit Ihrem Google-Konto an und füllen Sie die erforderlichen Formulardetails aus.
Geben Sie den Labelnamen ein, wählen Sie aus reCAPTCHA V2 , und wählen Sie im Dropdown-Feld die Überprüfungsanfragen mit der Option „Ich bin kein Roboter“ aus. Geben Sie zuletzt den Domänennamen Ihrer Anwendung an. Geben Sie für die lokale Entwicklung ein lokaler Host als Domainname.
warum geht mein handy nicht an
Sobald Ihre App registriert ist, leitet Sie die Website auf eine neue Seite mit Ihren generierten geheimen und Website-Schlüsseln weiter.
Erstellen Sie einen React-Client
Dieses Projekt ist zweigeteilt: Sie erstellen einen React-Client, der ein einfaches Anmeldeformular mit Google reCAPTCHA rendert, und ein Express-Backend, das POST-Anforderungen an die reCAPTCHA-API sendet, um das generierte Token zu überprüfen, nachdem ein Benutzer die reCAPTCHA-Aufforderung abgeschlossen hat.
Erstellen Sie lokal einen Projektordner, um Ihre Projektdateien zu speichern. Nächste, Erstellen Sie die React-Anwendung und ändern Sie das aktuelle Verzeichnis in das des Clients. Erstellen Sie im Stammverzeichnis Ihres Client-Ordners eine .env-Datei, um den geheimen API-Schlüssel und den Site-Schlüssel zu speichern.
REACT_APP_reCAPTCHA_SITE_KEY = 'site key'
REACT_APP_reCAPTCHA_SECRET_KEY = 'secret key'