Formulierung für Jamstack -Websites mit Cloudflare -Mitarbeitern

Dieses Tutorial zeigt, dass das Erstellen eines Formularhandelsdienstes für Ihre JamStack-Website oder eine einseitige Anwendung (SPA) mit CloudFlare-Mitarbeitern, einer serverlosen Plattform, die Geschwindigkeit und Kostenwirksamkeit bietet, mit Cloudflare-Mitarbeitern erstellt. Die HTML-Rendering und die Edge Server-Bereitstellung von Jamstacks Build-Time-HTML-Bereitstellung bieten schnelle Ladezeiten, aber die Serveraufgaben wie die Formularverarbeitung erfordern einen anderen Ansatz.

herkömmliche serverseitige Lösungen wie PHP vereinfachen die Form des Formulars, aber JamStack profitiert von serverlosen Funktionen. In diesem Tutorial wird Cloudflare -Mitarbeiter verwendet, um einen Microservice für die Formverarbeitung zu erstellen, das Kostenvorteile gegenüber dedizierten Servern bietet und komplexe Workflows durch Integration in Dienste wie Airtable ermöglicht.

Schlüsselvorteile:

• Nutzung von Cloudflare -Mitarbeitern für serverlose Formulierung auf Jamstack -Websites verbessert die Leistung und senkt die Kosten.
• Einschränkungen von Jamstack für dynamische Funktionen wie Formulare über eine serverlose Microservices -Architektur adressieren.
• Erforschung der Verwendung vorhandener Dienste von Drittanbietern (FORMSPREE, NETLIFY-Formulare usw.) zur schnellen Integration.
• Bauen von Handlern für benutzerdefinierte Formulare mit Cloudflare -Mitarbeitern für niedrigere Kosten pro Einreichung und maßgeschneiderte Sicherheit.
• Verwenden Sie das Edge -Netzwerk von Cloudflare für eine verringerte Latenz.
• Direct Browser-Side-Formularübermittlung mit JavaScript, einschließlich CORS Preflight Request Management.
• Bereitstellen und Testen in einer benutzerdefinierten Domäne für die Echtzeit-Leistungsüberwachung.

Formularhandler von Drittanbietern:

Dienste wie FormSpree, GETForm, FormData und Netlify-Formulare bieten Funktionen wie E-Mail-Benachrichtigungen, Spam-Filterung, Integrationen von Drittanbietern (Zapier), Dashboards, Datei-Uploads und CSV-Export. Obwohl sie bequem und oft kostenlose Ebenen anbieten, können sie für die Verwendung von Hochvolumen kostspielig werden.

Erstellen Sie Ihren eigenen Service (Vorteile):

Erstellen einer benutzerdefinierten Lösung mit Cloudflare -Mitarbeitern Angebote:

• niedrigere Kosten pro Einreichung.
• Anpassbare Sicherheitsrichtlinien.
• unbegrenzte Serviceintegrationen.
• reduzierte Latenz aufgrund von Edge Computing.
• Flexibilität zum Hinzufügen von Funktionen, die in Diensten von Drittanbietern nicht verfügbar sind.

E-Mail-Dienste wie SendGrid und MailGun bieten kostenlose Ebenen an, aber für direkte Datenbank- oder Anwendungsintegration können die Kosten pro Million Einsendungen erheblich niedriger sein als bei den Handlern von Drittanbietern.

Cloudflare -Mitarbeiter:

CloudFlare-Mitarbeiter, eine serverlose Plattform, vermeidet das in anderen serverlose Angebote gemeinsame "Cold Start"

Projektübersicht:

Dieses Tutorial führt Sie durch den Bau einer CloudFlare-Arbeiteranwendung und die Integration in ein vorgefertigtes React-Spa (Quellcode-Links). Das Tutorial konzentriert sich auf das Backend der Arbeiter, nicht auf die UI -Entwicklung.

Voraussetzungen:

• node.js
• Visual Studio Code
• gegen Code REST CLESIC -Erweiterung

Kontoeinrichtung:

1. benutzerdefinierte Domäne (empfohlen): Eine benutzerdefinierte Domäne vereinfacht die Bereitstellung, bietet Echtzeit-Protokollzugriff und verbessert die E-Mail-Lieferbarkeit. FastComet wird für die Domänenregistrierung und das E -Mail -Hosting vorgeschlagen.
2. MailGun -Setup: Erstellen Sie ein Mailgun -Konto (kostenloser Plan verfügbar), überprüfen Sie es, beachten Sie Ihren API -Schlüssel und Ihre Basis -URL und fügen Sie eine autorisierte E -Mail -Adresse hinzu. Test -E -Mail -Senden mit dem Befehl CULL. Eine benutzerdefinierte Domäne wird für höhere Sendungsgrenzen und eine verbesserte Posteingangszustellung empfohlen.
3. Cloudflare -Mitarbeiter einrichten: Melden Sie sich für ein CloudFlare -Arbeiterkonto an, installieren Sie die Wrangler -CLI (npm install -g @cloudflare/wrangler), melden Sie sich an (wrangler login) und überprüfen Sie die Installation (wrangler --version). Wenn Anmeldung fehlschlägt, lesen Sie die Schritte zur Fehlerbehebung im ursprünglichen Tutorial. Wenn Sie eine benutzerdefinierte Domäne verwenden, fügen Sie sie zu CloudFlare hinzu, ändern Sie den Namenserver und laden Sie cloudflared herunter/konfigurieren Sie
.

Projektentwicklung:

1. Projekt generieren: verwenden wrangler generate cloudflare-form-service, cd cloudflare-form-service und npm install. Aktualisieren Sie wrangler.toml mit Ihrer Konto -ID und richten Sie Skripte in package.json für die Entwicklung und Formatierung ein.
2. post -Anfragen zur Handhabung: index.js, um Postanforderungen zu verarbeiten, die Anforderungsbehörde (JSON- oder Formulardaten) zu lesen und entsprechende Antworten zurückzugeben (einschließlich Fehlerbehandlung).
3. Schema -Validierung: Installieren Sie @cfworker/json-schema (npm install @cfworker/json-schema), ändern Sie wrangler.toml in "type = "webpack", erstellen Sie validator.js mit einem JSON -Schema und einer Validierungslogik und integrieren . index.js
4. E -Mail -Integration: erstellen , email-service.js und email-text-template.js. Richten Sie die Umgebungsvariablen (Mailgun -API -Schlüssel, Mailgun -API -Basis -URL, von der E -Mail -Adresse bis zur E -Mail -Adresse) mit email-html-template.js oder dem CloudFlare -Dashboard ein. Integrieren Sie wrangler secret put in email-service.js. index.js
5. Hinzufügen von CORs: add zu corsHeaders und adoptimieren Sie die Anfragen vor dem Flug, um die Kompatibilität mit Browser -Sicherheitsmodellen zu gewährleisten. index.js

Projektbereitstellung:

1. Formulierer Service -Handhabungsdienst bereitstellen: Verwenden Sie , um die Mitarbeiter von Cloudflare zu bereitstellen. Test mit aktualisierten HTTP -Anforderungen in wrangler publish. test.http
2. benutzerdefinierte Domänenbereitstellung (optional): Einrichten von Staging- und Produktionsumgebungen in , erstellen Sie einen CNAME -Datensatz in Ihren CloudFlare -DNS -Einstellungen und veröffentlichen Sie mit wrangler.toml für die Produktion. Umgebungsvariablen mit wrangler publish -e production erneut hochladen. Testen Sie mit Anfragen an Ihre benutzerdefinierte Domain. wrangler secret put
3. Formular Benutzeroberfläche bereitstellen: Verwenden Sie das bereitgestellte React -Spa, konfigurieren Sie die -Datei mit der Anwendungs ​​-URL Ihrer Arbeiter und stellen Sie auf einer Plattform wie Cloudflare -Seiten, Netlify oder Vercel bereit. .env.
.

.

Zusammenfassung und FAQs:

Das Tutorial endet mit einer Zusammenfassung und einem umfassenden FAQ -Abschnitt, der Jamstack, Cloudflare -Mitarbeiter, alternative Formularverarbeitungsmethoden, Kostenüberlegungen und Einschränkungen abdeckt. Die FAQs untersuchen auch andere Funktionen und Funktionen von Cloudflare -Mitarbeitern. Die bereitgestellten Bilder bleiben in ihrem ursprünglichen Format und Ort.

Das obige ist der detaillierte Inhalt vonFormulierung für Jamstack -Websites mit Cloudflare -Mitarbeitern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!