Bei CrowdHandler sprechen wir viel über den Schutz von URLs und Seiten. Viele moderne Websites nutzen jedoch das SPA-Paradigma (Single Page Application).
Wenn Ihre Website ein Framework wie React, Angular oder Vue verwendet, möchten Sie wahrscheinlich wissen: „Kann CrowdHandler meine SPA schützen?“
Die Antwort lautet natürlich „Ja“ – und es ist ein einfacher zweistufiger Vorgang.
Einrichtung eines Warteschlangensystems zum Schutz eines SPA
Lassen Sie uns zunächst einmal darüber nachdenken, wie eine SPA funktioniert. Im Gegensatz zu einer herkömmlichen Website, die aus mehreren HTML-Seiten besteht, handelt es sich bei einer SPA um eine einzige HTML-Seite, die ein JavaScript-Framework lädt. Auch wenn Nutzer beim Navigieren durch eine SPA möglicherweise URLs in ihrem Browser sehen, greift die Anwendung nicht jedes Mal auf den Server zurück, um eine völlig andere Seite zu laden. Stattdessen führt sie verschiedene API-Aufrufe durch – auch auf Inhalte, die sich möglicherweise nicht einmal auf derselben Domain befinden –, um Bildschirmaktualisierungen zusammenzustellen.
Schritt 1: JavaScript-Integration
Wenn Sie also nach einem Online-Warteschlangensystem suchen, um eine SPA vor übermäßigem Datenverkehr zu schützen, besteht der erste Schritt darin , die JavaScript-Integration von CrowdHandler zu nutzen und dabei den SPA-Modus zu aktivieren. Dies dauert gerade einmal 15 Minuten und bietet Ihnen die erste und wichtigste Schutzebene: die Überprüfung von Nutzeranfragen und die Umleitung der Nutzer in den Warteraum, falls erforderlich.
Wenn CrowdHandler im SPA-Modus läuft, sucht es nicht nach Anfragen an den Server, sondern lediglich danach, ob Ihr JavaScript die URL im Browser ändert; es reagiert jedoch so, als hätte eine Seitenanfrage stattgefunden. Das bedeutet, dass Sie CrowdHandler nutzen können, um Ihre gesamte Website oder nur bestimmte Bildschirme innerhalb Ihrer SPA zu schützen – zum Beispiel, um ein einzelnes Ereignis in einer Ticket-Anwendung zu schützen. CrowdHandler im SPA-Modus bietet genau denselben Schutz und dieselbe Benutzererfahrung wie auf einer herkömmlichen Website, einschließlich der Reaktion auf Änderungen der Fensterposition, um die Sitzungen der Benutzer aufrechtzuerhalten.
Schritt 2: Serverseitiger Schutz / API-Schutz
Wenn Sie in Ihrem SPA schnell einen grundlegenden Schutz für den Warteraum einrichten möchten, sollte die JavaScript-Integration von CrowdHandler die Last für die meisten Anwendungsfälle bewältigen können. Für echte Sicherheit sind jedoch serverseitige Prüfungen erforderlich.
Den aufmerksamen Lesern unter Ihnen wird aufgefallen sein, dass zwar eine SPA für das Benutzererlebnis sorgt, aber eigentlich die API geschützt werden muss – nicht nur vor Überlastung, sondern auch vor allen, die versiert genug sind, die JavaScript-Integration zu umgehen und direkt mit der API zu interagieren.
(Nehmen wir noch einmal das Beispiel des Ticketverkaufs: Nutzer, die einen Theaterbesuch buchen, können ihren Sitzplatz auswählen, indem sie mit einer Sitzplatzauswahlkarte auf der SPA interagieren … doch die SPA bezieht diese Informationen von der Sitzplatzbuchungs-API, die möglicherweise nicht einmal unter derselben Domain läuft. Daher muss diese API geschützt werden.)
Schritt zwei besteht also – zusätzlich zur JavaScript-Integration – darin, CrowdHandler in Ihre API zu integrieren.
Dies dient nicht nur als zweite Schutzebene, sondern übermittelt auch wichtige Leistungsdaten an CrowdHandler, sodass Sie Funktionen wie „Autotune“ optimal nutzen können.
Durch die zusätzliche API-Integration kann CrowdHandler die Sitzungen zählen, die auf die API zugreifen, sie in eine Warteschlange stellen und sie mit den in der SPA gefundenen Warteschlangentoken abgleichen. Mit anderen Worten: Wenn jemand versucht, einen Vorgang über die API auszuführen, aber kein gültiges, von der SPA ausgestelltes Token besitzt, kann die Anfrage ignoriert werden.

Es gibt mehrere Möglichkeiten, dies einzurichten, und unser Support-Artikel „Schutz einer Single-Page-Anwendung (SPA) – Erweiterte Integration“ erläutert dies ausführlicher. Der Artikel enthält außerdem funktionsfähigen Code und einen funktionsfähigen EdgeWorker für CloudFront, der nach Bedarf angepasst werden kann.
Sicherheit: CrowdHandler für Ihr SPA
Der Schutz Ihrer SPA mit CrowdHandler ist ganz einfach, und Sie können alles über unser Control Panel konfigurieren – genau wie bei einer klassischen Website.
Wenn Sie nach einer Möglichkeit suchen, in Ihrem SPA sowohl ein angenehmes Wartezimmererlebnis zu bieten als auch Ihre API umfassend zu schützen, probieren Sie CrowdHandler noch heute aus.