Gatekeeping-Middleware: Token-Gating und Mitgliedschaften
So erstellen Sie „NFT Access“- oder „VIP Only“-Sammlungen mit Edge Middleware in Remix. Blockieren von Anfragen, bevor sie den Server erreichen.
Sie starten einen „Friends & Family“-Verkauf. Sie senden den Link per E-Mail. Jemand postet es auf Reddit. 10.000 Menschen plündern Ihren Bestand. Sie benötigen Gatekeeping. Die Logik muss am Edge erfolgen. Wenn der Benutzer nicht berechtigt ist, rendern Sie die Seite nicht einmal.
Warum Maison Code darüber spricht
Bei Maison Code Paris fungieren wir als das architektonische Gewissen unserer Kunden. Wir übernehmen oft „moderne“ Stacks, die ohne grundlegendes Verständnis für Skalierung gebaut wurden.
Wir diskutieren dieses Thema, weil es einen kritischen Wendepunkt in der technischen Reife darstellt. Die korrekte Implementierung unterscheidet ein fragiles MVP von einer widerstandsfähigen Plattform auf Unternehmensniveau.
Das Edge-Middleware-Muster
In Remix/Next.js wird Middleware bei jeder Anfrage ausgeführt.
„Typoskript // app/entry.server.tsx (oder middleware.ts) import { redirect } from ‘@remix-run/node’;
Asynchrone Funktion exportieren checkAccess(request, user) { const url = neue URL(request.url);
// 1. Überprüfen Sie, ob die Route geschützt ist if (url.pathname.startsWith(‘/collection/vip’)) {
// 2. Überprüfen Sie die Anmeldung
if (!user) throw restart('/account/login');
// 3. Tag/Token prüfen
const tags = user.tags || [];
const hasVipTag = tags.includes('VIP_TIER_1');
const hasNft = waiting checkWallet(user.wallet, 'BORED_APE');
if (!hasVipTag && !hasNft) {
throw weitergeleitet('/pages/access-denied');
}
} } „
Token-Gating (Web3)
Für NFT-Marken ist der „Login“ ein Wallet Connect. Wir verwenden SIWE (Sign In With Ethereum).
- Der Benutzer klickt auf „Wallet verbinden“.
- Unterschreibt eine Nonce.
- Der Server überprüft die Signatur.
- Server fragt Blockchain Node (Alchemy/Infura): „Besitzt Wallet X Token Y?“
- Wenn ja, geben Sie ein Sitzungscookie aus.
Passwortschutz (einfach)
Manchmal braucht man für die Sammlung einfach ein Passwort. Verwenden Sie nicht die globale Passwortseite von Shopify. Erstellen Sie ein gültiges Passwort. Speichern Sie den Passwort-Hash im Sammlungsmetafeld. Benutzer gibt Passwort ein -> Hash überprüfen -> Cookie „collection_access_123=true“ festlegen -> Zugriff zulassen.
Geo-Gating
„Dieses Produkt darf in Kalifornien nicht verkauft werden.“ (Regulatorisch).
Überprüfen Sie „request.cf.region“ (Cloudflare) oder „request.geo.city“ (Vercel).
Wenn region === 'CA', blenden Sie die Schaltfläche „In den Warenkorb“ aus oder leiten Sie um.
5. Rollenbasierte Zugriffskontrolle (RBAC) am Edge
„Administratoren können „/dashboard“ sehen. Benutzer nicht.“ Normalerweise überprüfen Sie dies in der Serverkomponente. Aber das verschwendet CPU. Überprüfen Sie es in Middleware. Speichern Sie Rollen im JWT („user.roles = [‘admin’]`). Middleware dekodiert das JWT (ignoriert die Signaturüberprüfung aus Geschwindigkeitsgründen oder überprüft mithilfe von Edge-kompatibler Krypto). Wenn die Rolle != admin ist, wird sofort 403 Forbidden zurückgegeben. Dies schützt Ihre Backend-API vor unbefugtem Zugriff.
6. Bot-Schutz (Cloudflare Turnstile)
Middleware ist der perfekte Ort, um Bots zu stoppen. Wenn „User-Agent“ „HeadlessChrome“ ist, blockieren. Wenn „cf-bot-score“ < 30, blockieren. Wir injizieren Cloudflare Turnstile (Smart Captcha) speziell für verdächtige Anfragen. Der normale Benutzer sieht nichts. Der Bot sieht eine Herausforderung. Dies geschieht, bevor Ihre Datenbank überhaupt berührt wird.
8. Serverseitiges A/B-Testen
Clientseitige A/B-Tests (Google Optimize) verursachen „Flicker“. Der Benutzer sieht die alte Überschrift 0,5 Sekunden lang, dann wechselt sie. Middleware löst dieses Problem.
- Die Anfrage geht ein.
- Middleware prüft „cookie_bucket“. Wenn leer, weisen Sie „bucket=B“ zu.
- Schreiben Sie die Anfrage in „/variants/home-b“ um.
- Der Server rendert Variante B.
- Der Benutzer sieht Variante B sofort. Kein Flimmern. SEO-sicher (wenn Canonicals verwaltet werden).
9. Personalisierte Preisgestaltung am Edge
„VIP-Benutzer erhalten 20 % Rabatt.“ Wenn Sie dies in Client JS tun, ändert der Hacker lediglich die Logik. Wenn Sie dies in Middleware tun, ist es sicher.
- Middleware sieht „user_tier=vip“.
- Middleware fügt den Header „x-pricing-tier: vip“ ein.
- Origin Server rendert 80 € statt 100 €. Der HTML-Code kommt mit dem korrekten Preis an. Der Benutzer kann es nicht manipulieren.
10. DDoS-Abwehr auf der Anwendungsebene
Netzwerk-DDoS wird von Cloudflare abgewickelt.
Anwendungs-DDoS (Schicht 7) ist schwieriger.
„Suche 1000 Mal pro Sekunde nach ‚a‘.“ (Tötet die DB).
Middleware ist der Filter.
Wir implementieren Token Bucket Rate Limiting pro IP vor dem Remix-Rendering.
const erlaubt = waiting rateLimit.check(ip, 10, "10s");
Wenn sie 10 Anfragen in 10 Sekunden überschreiten, wird 429 Too Many Requests zurückgegeben.
Ihr Rendering-Server wacht nicht einmal auf.
11. Die Warteschlange (Virtueller Warteraum)
Bei „Hyped Drops“ (Yeezy/Supreme) kann kein Server mit der Spitze umgehen. Middleware leitet den Datenverkehr an eine virtuelle Warteschlange (Queue-it oder Custom Redis) weiter.
- Überprüfen Sie „queue_token“. Fehlen?
- Leiten Sie zu „/queue“ um.
- Benutzer wartet. WebSocket aktualisiert die Position „Sie sind #5000“.
- Der Benutzer greift nach vorne. Weiterleiten zu „/product?token=xyz“.
- Middleware validiert Token. Ermöglicht den Zugriff für 10 Minuten. Dadurch wird die Verkehrskurve von einem „Spike“ zu einem „Plateau“ abgeflacht.
12. HMAC-Signierung für B2B
Wenn Sie einen B2B-Shop haben, verfügen Sie oft über einen „Portal“-Link von einem ERP. Der Benutzer klickt in NetSuite auf den Link -> Bei Shopify angemeldet. Wie sichern Sie diesen Link? HMAC (Hash-basierter Nachrichtenauthentifizierungscode). Der Link enthält „?user=123×tamp=17000000&signature=abc…“. Middleware überprüft die Signatur mithilfe eines gemeinsamen Geheimnisses. Wenn „Zeitstempel“ älter als 5 Minuten ist, ablehnen. Dies ermöglicht eine „passwortlose“ Anmeldung, die kryptografisch sicher ist.
11. Warum Maison Code?
Bei Maison Code betrachten wir Middleware als Schutzschild. Es ist die erste Verteidigungslinie. Wir lassen Ihre spezifische Geschäftslogik nicht im clientseitigen JS offen. Wir verlagern Komplexität an den Rand. Wir haben „Token Gated“-Stores für NFT-Projekte und „VIP Tiers“ für Luxusmodehäuser gebaut. Wir wissen, wie wir die Bots blockieren und gleichzeitig den VIPs den roten Teppich ausrollen.
13. Erweiterte Bot-Erkennung (Heuristik)
Bots werden immer schlauer. Sie führen JS aus. Sie geben Captchas weiter (unter Verwendung von Farmen). Wir brauchen Verhaltensanalyse am Edge.
- Mausbewegung: Bots bewegen sich in geraden Linien. Der Mensch bewegt sich in Kurven.
- Zeit auf der Seite: Bots kaufen in 2 Sekunden. Der Mensch braucht 20 Sekunden.
- Anfrage-Header: Bei Bots stimmen „User-Agent“ und „Sec-CH-UA“ oft nicht überein. Wir verwenden die Cloudflare-Worker-Logik, um diese Anfragen zu bewerten. „Punktzahl < 10“? Stille Weiterleitung zu einer „Honeypot“-Kaufabwicklung, die ihnen Gebühren berechnet, aber nichts versendet. Das verschwendet ihr Geld und hält sie davon ab, Sie erneut anzugreifen.
14. Geo-Fencing zur Lizenzeinhaltung
Sie verkaufen Nike. Sie dürfen in der EU verkaufen, nicht jedoch in den USA.
Die Validierung durch den „Address Picker“ ist zu spät. Der US-Kunde sieht das Produkt, legt es in den Warenkorb und wird an der Kasse abgelehnt.
Sie sind wütend.
Edge Geo-Fencing verbirgt das Produkt basierend auf IP.
Wenn cf-ipcountry == 'US' ist, gibt die Produktseite 404 zurück.
Der Benutzer weiß nie, dass es existiert.
Dadurch wird Ihr Anbieterlizenzvertrag geschützt und die Möglichkeit des Exports auf den „Grauen Markt“ verhindert.
15. Die Middleware-Checkliste (Startbereitschaft)
Stellen Sie keine Middleware bereit, ohne Folgendes zu überprüfen:
- Fail Open vs. Fail Close: Blockieren Sie bei Middleware-Fehlern alle oder lassen Sie alle herein? (Standardeinstellung: Aus Sicherheitsgründen nicht geschlossen).
- Timeout: Stellen Sie ein Timeout von 50 ms ein. Wenn KV langsam ist, hängen Sie die Seite nicht auf.
- Regionsprüfung: Über VPN aus gesperrtem Land getestet?
- Token umgehen: Haben Sie einen Abfrageparameter „?token=admin_bypass“ für den Notfallzugriff?
- Cache-Regeln: Stellen Sie sicher, dass „Vary: Cookie“ eingestellt ist, damit Sie die Seite „Zugriff verweigert“ nicht für alle zwischenspeichern.
- Protokollierung: Jeden Block in Datadog protokollieren.
- User Agent: Googlebot auf die Whitelist setzen (User-Agent-Prüfung).
- Ratenlimit: Gilt das Limit pro IP oder pro Sitzung?
- [] Statische Assets: Middleware für „.jpg“, „.css“, „.js“ umgehen.
- Ausnahmebehandlung: Try/Catch-Block um alles herum.
- Kaltstart: Stellen Sie sicher, dass der WASM-Kaltstart < 10 ms beträgt.
- Kosten: Aufrufe überwachen. Middleware wird bei jeder Anfrage ausgeführt.
- Umleitungsschleife: Stellen Sie sicher, dass Sie nicht auf eine geschützte Seite umleiten.
- Mobile App: Unterbricht Ihre Middleware die API-Aufrufe der iOS-App?
- Sitemap: sitemap.xml nicht ausblenden.
16. Fazit
Gatekeeping schafft Knappheit. Knappheit schafft Wert. Aber das Tor muss sicher sein. Das Ausblenden einer Schaltfläche über CSS („display: none“) stellt keine Sicherheit dar. Jeder kann Element inspizieren. Middleware ist der einzige Weg. Es ist schnell, unsichtbar und unzerbrechlich.
**[Beauftragen Sie unsere Architekten](/contact)**.