Hervorragende Software und praktische Tutorials
Cloudflare verwendet Workers und Pages, um einen Website-Reverse-Proxy bereitzustellen
verwenden Cloudflare Arbeiter und SeitenProxyWebsite-Reverse-Proxy ist eine praktische Methode, mit der Sie den Zugriff beschleunigen, Einschränkungen umgehen oder die Quelladresse verbergen können. Die folgende kurze Anleitung zeigt Ihnen, wie Sie diese beiden Methoden nutzen, um die Reverse-Proxy-Funktion zu nutzen. Der gesamte Prozess erfordert kein eigenes Server-Hosting, sondern kann mithilfe der Edge-Computing-Funktionen von Cloudflare durchgeführt werden.
Cloudflare ist nicht nur ein CDN-Dienstanbieter, sondern eine leistungsstarke, sichere und zuverlässige globale Netzwerkplattform mit geringer Latenz.
Dank seiner globalen Edge-Computing-Architektur kann Cloudflare die Bereitstellung statischer und dynamischer Inhalte effizient beschleunigen und gleichzeitig präzise Caching-Strategien zur Optimierung der Bandbreitennutzung bereitstellen. Darüber hinaus kann der integrierte unbegrenzte DDoS-Schutzmechanismus verschiedene Netzwerkangriffe effektiv abwehren und die Stabilität und Sicherheit des Unternehmens gewährleisten.
Heute werden wir Cloudflare Workers und Cloudflare Pages verwenden, um einen effizienten Reverse-Proxy-Dienst aufzubauen, der die Vorteile von Cloudflare beim verteilten Rechnen und der Edge-Netzwerkbeschleunigung voll ausschöpft.
Vorbereitung vor der Konfiguration des Website-Reverse-Proxys
Cloudflare-Konto
Wenn Sie noch kein Konto haben, besuchen Sie bitteCloudflareMelden Sie sich an!
Der Registrierungsprozess für ein Cloudflare-Konto ist relativ einfach und kann mit einem Google-Konto, einem Apple-Konto oder einer benutzerdefinierten E-Mail-Adresse registriert werden.
Wir empfehlen, sich über Google zu registrieren. Google-Konten decken fast alle gängigen ausländischen Websites ab und ermöglichen die Anmeldung. Falls Sie noch kein Google-Konto haben, registrieren Sie sich jetzt!
Domain aktivieren
Sie müssen Ihren Domänennamen zu Cloudflare übertragen. Wenn Sie nicht wissen, wie Sie Ihren Domänennamen in Cloudflare aktivieren, erfahren Sie hier, wie Sie ihn aktivieren.
Um Cloudflare zu aktivieren, müssen Ihre Nameserver aktualisiert werden.
Fügen Sie im Cloudflare-Hintergrund einen neuen Domänennamen hinzu, geben Sie den Domänennamen ein, wählen Sie standardmäßig „Quick Scan DNS Records“ aus und klicken Sie auf „Weiter“!
Wählen Sie den kostenlosen Plan und der Domänenname wird erfolgreich hinzugefügt!
Melden Sie sich anschließend auf der Website an, auf der Ihr Domainname registriert ist. Suchen Sie im Backend die Einstellung „DNS-Sicherheit (DNSSEC)“ und deaktivieren Sie sie. Falls sie standardmäßig deaktiviert ist, ignorieren Sie sie bitte. Sie können sie später über Cloudflare wieder aktivieren.
Ersetzen Sie Ihre aktuellen Nameserver durch die von Cloudflare zugewiesenen Nameserver.
Hinweis: Jedem Domänennamen wird ein anderer Nameserver zugewiesen. Löschen Sie die redundanten Nameserver und tragen Sie die Cloudflare-Nameserver in Nameserver 1 und Nameserver 2 ein.
Nehmen wir Namesilo als Beispiel:
Klicken Sie im Hintergrund auf den Domänennamen, rufen Sie die Domänennamen-Betriebsseite auf, bearbeiten Sie den Nameserver und löschen Sie den Inhalt im Nameserver.
Speichern Sie den Nameserver, nachdem Sie ihn geändert haben. Die Gültigkeitsdauer ist in einigen Bereichen später, sodass Sie vorerst nicht auf die Gültigkeitsdauer achten müssen.
Wenn der Domänennamenstatus im Cloudflare-Hintergrund aktiv ist, bedeutet dies, dass er wirksam ist. Wenn der Nameserver nicht wirksam ist oder falsch geändert wurde, wird angezeigt, dass der Nameserver ungültig ist.
GitHub-Konto
Wenn Sie noch kein Konto haben, besuchen Sie bitteGitHubMelden Sie sich an!
Um ein Konto auf GitHub zu erstellen, können Sie sich nur mit einer E-Mail-Adresse registrieren. Es wird empfohlen, sich über Gmail zu registrieren.
Sie erhalten den Bestätigungscode in Ihrer Mailbox. Nach dem Ausfüllen ist Ihr Konto erfolgreich registriert!
Bereitstellen eines Website-Reverse-Proxys mithilfe von Workern und Seiten
Als Nächstes verwenden wir Worker und Pages, um den Reverse-Proxy der Website bereitzustellen. Es gibt zwei Möglichkeiten, den Reverse-Proxy der Website bereitzustellen. Lassen Sie uns den Bereitstellungsprozess üben.
Vorsichtsmaßnahmen
- Workers-Methode: Kopieren Sie _worker.js, speichern Sie es in Cloudflare und stellen Sie es bereit.
- Pages-Methode: Forken Sie das Repository und verbinden Sie GitHub mit Cloudflare für die Bereitstellung mit einem Klick.
- Workers vs. Pages: Workers eignet sich besser für rein dynamische Proxys, während Pages sich für die Mischung statischer Inhalte und dynamischer Funktionen eignet. Handelt es sich lediglich um einen einfachen Reverse-Proxy, ist Workers direkter.
- Kostenloses Kontingent: Die kostenlose Stufe von Cloudflare bietet 100.000 Workers-Anfragen pro Tag und Pages hat ein ähnliches Limit, was für den persönlichen Gebrauch ausreicht, für großen Datenverkehr kann jedoch ein kostenpflichtiger Plan erforderlich sein.
- Inländischer Zugriff: workers.dev und pages.dev können in Festlandchina eingeschränkt sein. Es wird empfohlen, einen benutzerdefinierten Domänennamen zu binden.
- Sicherheit: Stellen Sie sicher, dass die Zielwebsite Proxy-Zugriff zulässt, um Verstöße gegen die Nutzungsbedingungen zu vermeiden.
Verwenden von Cloudflare Workers zum Implementieren eines Reverse-Proxys
Cloudflare Workers sind serverlose Skripte, die auf den globalen Edge-Knoten von Cloudflare ausgeführt werden und HTTP-Anfragen problemlos verarbeiten und an die Zielwebsite weiterleiten können.
Schritt 1: Registrieren und bei Cloudflare anmelden
Wenn Sie noch kein Cloudflare-Konto haben, registrieren Sie eines auf der offiziellen Website und melden Sie sich dann an.
Schritt 2: Erstellen Sie einen Worker
Klicken Sie im Cloudflare-Dashboard links unter „Compute (Workers)“ auf „Workers and Pages“ und wählen Sie dann „Quick Start“ aus.
Geben Sie Ihrem Worker einen Namen (standardmäßig wird ein Domänenname ähnlich IhremNamen.workers.dev generiert).
Nachdem Sie den Namen eingegeben haben, klicken Sie auf „Bereitstellen“, um die Bereitstellungsseite aufzurufen.
Klicken Sie auf „Code bearbeiten“, um den Worker-Editor aufzurufen, löschen Sie den Standardcode und fügen Sie das folgende einfache Reverse-Proxy-Skript ein.
Schritt 3: Erstellen eines Reverse-Proxy-Skripts
Erstellen Sie ein benutzerdefiniertes JavaScript-Skript. Hier ist ein Beispiel für ein Reverse-Proxy-Skript:
addEventListener('fetch', event => { event.respondWith(handleRequest(event.request)); }); async function handleRequest(request) { const url = new URL(request.url); // Zielwebsite, an die die Anfrage weitergeleitet wird const targetHost = 'example.com'; // Ersetzen Sie durch den Domänennamen, den Sie als Proxy verwenden möchten url.hostname = targetHost; // Erstellen Sie eine neue Anfrage const newRequest = new Request(url, request); return await fetch(newRequest); }Dieses Skript leitet alle an Ihren Worker gesendeten Anfragen an example.com weiter.
Schritt 4: Speichern der Bereitstellung
Klicken Sie oben rechts auf die blaue Schaltfläche „Bereitstellen“, und Ihr Worker ist online. https://your-worker-name.yourname.workers.dev Besuchen Sie es.
Schritt 5: Konfigurieren des Domänennamens
Da der Domänenname workers.dev im Land nicht zugänglich ist, müssen Sie einen neuen Domänennamen konfigurieren.
Klicken Sie unter „Konfigurationsoptionen“ im Menü „Domänen und Routen“ auf „Hinzufügen“.
Wählen Sie „Benutzerdefinierte Domäne“, geben Sie den Domänennamen ein und speichern Sie. Der Domänenname wurde nun erfolgreich hinzugefügt und kann über den neuen Domänennamen aufgerufen werden.
An diesem Punkt wurde die Reverse-Proxy-Funktion mit Cloudflare Workers realisiert. Sie ist ganz einfach. Anschließend können Sie Pages verwenden, um einen Website-Reverse-Proxy bereitzustellen.
Stellen Sie mit Cloudflare Pages einen Website-Reverse-Proxy bereit
Cloudflare Pages ist eine statische Website-Hosting-Plattform, die Git-Repositorys mit automatisierter Bereitstellung kombiniert und sich für den schnellen Start von Front-End-Projekten eignet. Kürzlich wurde die Functions-Funktion (im Wesentlichen eine Variante von Workers) hinzugefügt, die die Ausführung dynamischen Codes am Edge ermöglicht.
Cloudflare Pages wird hauptsächlich zum Hosten statischer Websites verwendet, kann aber in Kombination mit Functions (Worker-basierten Funktionen) auch einen Reverse-Proxy implementieren.
Beginnen wir mit der Bereitstellung eines Reverse-Proxys mithilfe von Cloudflare Pages.
Schritt 1: Erstellen Sie ein Pages-Projekt
Klicken Sie im Cloudflare-Dashboard unter „Workers and Pages“ auf „Erstellen“, wählen Sie dann „Seiten“ aus und klicken Sie auf „Mit Git verbinden“.
Verbinden Sie Ihr GitHub- oder GitLab-Repository (Sie können ein einfaches, leeres statisches Projekt erstellen, beispielsweise nur mit einer index.html).
Schritt 2: Mit dem Repository verbinden
Hier nehmen wir GitHub als Beispiel. Zuerst müssen Sie ein Projekt auf GitHub erstellen.
Erstellen Sie ein Repository auf Github und fügen Sie Code hinzu, melden Sie sich an Github Klicken Sie dann, wie in der Abbildung unten gezeigt, auf „Repository erstellen“, um ein privates Repository mit dem Namen Cloudflare Pages zu erstellen.
Beachten Sie, dass Sie beim Erstellen eines neuen Repositorys „privat“ auswählen müssen, da sonst jeder darauf zugreifen kann.
Erstellen Sie anschließend eine neue Datei. Klicken Sie auf „Neue Datei erstellen“, um die Datei zu erstellen.
Erstellen Sie als Nächstes eine Datei mit dem Namen _worker.js, kopieren Sie den folgenden Code, ändern Sie die fünfte Zeile mit den einfachen Anführungszeichen in die Website, die Sie umkehren möchten, und speichern und bestätigen Sie die Änderungen.
Der JS-Code des Reverse-Proxys sollte darauf achten, dem Domänennamen keine Zeichen wie https und http hinzuzufügen.
exportiere Standard { asynchrones Abrufen (Anforderung, Umgebung) { lass URL = neue URL (Anforderung.URL); wenn (url.pathname.startsWith('/')) { url.hostname = 'Inverse Adresse' lass neue_Anforderung = neue Anforderung (URL, Anforderung); returniere Abrufen (neue_Anforderung); } returniere Umgebung.ASSETS.Abrufen (Anforderung); }, };
Wenn Sie wieder auf Cloudflare Pages sind, wählen Sie GitHub aus und klicken Sie auf die Schaltfläche „Mit GitHub verbinden“.
Die Seite springt zu Github und klickt auf die Schaltfläche „Installieren und autorisieren“.
Geben Sie das Passwort ein, um eine Verbindung herzustellen. Kehren Sie nach erfolgreicher Verbindung zu Cloudflare Pages zurück.
Klicken Sie nach der Auswahl des Repositorys auf „Setup starten“.
Auf der Seite „Build und Bereitstellung festlegen“ können Sie den Projektnamen ändern oder den Standardnamen verwenden und dann auf „Speichern und bereitstellen“ klicken.
Viele Menschen scheitern, wenn sie zum ersten Mal mit der Bereitstellung beginnen.
Dies liegt daran, dass die Build-System-Version von Cloudflare Pages auf Version 2 aktualisiert wurde. Ändern Sie in den Projekteinstellungen die Build-System-Version auf Version 1 und führen Sie anschließend eine erneute Bereitstellung durch, um erfolgreich zu sein!
Nach erfolgreicher Bereitstellung können Sie einen separaten Domänennamen an die benutzerdefinierte Domäne binden.
An diesem Punkt ist der Cloudflare Pages Reverse Proxy eingerichtet. Ist das nicht ganz einfach?
Die Unterschiede und Vor- und Nachteile der Bereitstellung von Reverse-Proxy mit Workers und Pages
Wählen Sie das Worker-Szenario aus:
Es werden leistungsstarke Reverse-Proxy-Funktionen benötigt, beispielsweise:
- Ändern Sie alle Arten von Antwortinhalten (HTML, XML, JSON usw.).
- Behandelt komplexe Ersetzungsregeln oder dynamisches Routing.
- Präzise Kontrolle über Antwortheader oder Caching-Richtlinien.
Die Leistungsanforderungen sind hoch und die gesamte Logik muss serverseitig abgeschlossen werden.
Projekte, die Edge Computing beinhalten oder globale Antworten mit geringer Latenz erfordern.
Szenario „Seiten auswählen“:
Die Anforderungen für den Reverse-Proxy sind einfach, z. B. nur HTML-Proxying und wenige Ersetzungen.
- Bei dem Projekt handelt es sich hauptsächlich um eine statische Website mit nur einem einfachen Reverse-Proxy oder einer Weiterleitung.
- Sie möchten keine zusätzlichen Kosten, sondern verlassen sich einfach auf das kostenlose Kontingent.
- Das Entwicklungsteam ist mit der Front-End-Entwicklung vertraut und bevorzugt die Bereitstellung statischer Dateien.
Wenden Sie mehrere Regeln zum Ersetzen von Inhalten an (einschließlich Titel, URL, Bild usw.). Nach dem Vergleich werden folgende Vorschläge gemacht:
- Arbeiter:
Vorteile: Es kann Ihre Skripte perfekt implementieren, alle Ersetzungen direkt auf dem Server durchführen, reguläre Ausdrücke und mehrere Inhaltstypen unterstützen und eine bessere Leistung und Benutzererfahrung bieten.
Empfohlener Grund: Wenn Ihre Anforderungen komplexe Ersetzungsregeln (mehrere Übereinstimmungen mit regulären Ausdrücken) und URL-Umschreiben beinhalten, ist Workers besser geeignet. - Seiten:
Einschränkungen: Der Ersatz kann nur durch clientseitiges JS erreicht werden, die Leistung ist schlecht und Nicht-HTML-Inhalte oder Antwortheader können nicht verarbeitet werden.
Anwendbarkeit: Wenn Sie über ein begrenztes Budget verfügen und nur HTML als Proxy verwenden möchten, können Sie es verwenden, die Erfahrung ist jedoch nicht so gut wie bei Workers.
Empfohlene Lösung: Verwenden Sie Cloudflare Workers. Es erfüllt Ihre Anforderungen an Reverse-Proxy und Content-Ersetzung vollständig und bietet bessere Leistung und Flexibilität.
