Integration¶
Die Integration des Myra EU CAPTCHA besteht immer aus zwei Teilen: dem Widget in Ihrer Seite und der Prüfung des Tokens auf Ihrem Server. Erst beide Teile zusammen ergeben einen Schutz.
Für die verbreiteten Plattformen stehen Bibliotheken, Erweiterungen und Beispiele bereit, die diese beiden Teile übernehmen. Die folgenden Kapitel beschreiben je Plattform die Installation, die Konfiguration und die Prüfung.
Note
Die Anleitungen dieses Kapitels setzen einen angelegten Sitekey voraus. Der Weg von einem neuen Konto bis zur geprüften Integration steht unter Einrichtung mit den Schritten Ersten Sitekey anlegen, Widget einbinden und Integration testen.
Aufbau einer Integration¶
Jede Integration führt die folgenden drei Schritte aus:
| Schritt | Ort | Inhalt |
|---|---|---|
| 1 | Frontend | Das Skript verify.js vom CDN laden. |
| 2 | Frontend | Das Widget-Element mit dem öffentlichen Sitekey einfügen. |
| 3 | Backend | Das Token vor der Verarbeitung über den Endpunkt /verify prüfen. |
Siehe Widget einbinden.
Note
Die beiden Schritte im Frontend laufen im Browser der Besuchenden ab. Wenn Ihre Website eine Content Security Policy sendet, dann muss diese die Adressen des Dienstes freigeben. Diese Voraussetzung gilt für jede Plattform dieses Kapitels. Siehe Content Security Policy.
Verfügbare Anleitungen¶
Die folgenden Anleitungen stehen zur Verfügung:
| Kategorie | Plattformen |
|---|---|
| CMS | WordPress, Joomla, Drupal, TYPO3 |
| Frontend | HTML und JavaScript, React, Vue, Angular, Svelte |
| Backend | PHP, Symfony und Laravel, Python, Django, Ruby, Java, Client aus der Spezifikation |
| Mobile Apps | Android, iOS, Flutter |
| Infrastruktur | Caddy, CrowdSec, Traefik |
Vollständige Beispiele¶
Die Anleitungen je Plattform beschreiben jeweils eine Seite der Integration. Die Beispiele führen beide Seiten an einem durchgehenden Fall zusammen: Sie schützen das Kontaktformular einer bereits laufenden Anwendung und ändern dafür nur wenige Dateien.
Die folgenden Beispiele stehen zur Verfügung:
| Beispiel | Frontend | Backend |
|---|---|---|
| React und PHP | React mit Vite | PHP |
| Vue und Python | Vue mit Vite | Python mit Flask |
| Angular und Java | Angular | Java mit Spring Boot |
| Svelte und Ruby | Svelte mit Vite | Ruby mit Sinatra |
| HTML und Django | HTML ohne Framework | Django |
Angaben aus dem Kundenportal¶
Ansicht Details
Alle Anleitungen benötigen die folgenden Angaben aus der Ansicht Details des Sitekeys:
| Angabe | Verwendung |
|---|---|
| Public Sitekey | Im Widget-Element und in der Konfiguration des Frontends. Der Wert ist öffentlich. |
| Secret | Ausschließlich in der serverseitigen Prüfung. Der Wert bleibt auf dem Server. |
Siehe Ansicht Details.