Pengendalian bentuk untuk laman web jamStack menggunakan pekerja Cloudflare-tutorial js-php.cn

Tutorial ini menunjukkan membina perkhidmatan pengendalian bentuk untuk laman web Jamstack atau aplikasi tunggal halaman (SPA) menggunakan pekerja CloudFlare, platform tanpa pelayan yang menawarkan kelajuan dan keberkesanan kos. Jamstack's Build-Time HTML Rendering dan EDGE Server Deployment menyediakan masa pemuatan cepat, tetapi mengendalikan tugas-tugas sisi pelayan seperti pemprosesan borang memerlukan pendekatan yang berbeza.

Penyelesaian sisi pelayan tradisional seperti PHP memudahkan pengendalian bentuk, tetapi manfaat jamStack dari fungsi tanpa pelayan. Tutorial ini menggunakan pekerja Cloudflare untuk membuat mikroservis untuk pemprosesan borang, menawarkan kelebihan kos ke atas pelayan yang berdedikasi dan membolehkan aliran kerja kompleks dengan mengintegrasikan dengan perkhidmatan seperti Airtable.

Kelebihan utama:

memanfaatkan pekerja Cloudflare untuk pengendalian bentuk tanpa pelayan di laman web jamStack meningkatkan prestasi dan mengurangkan kos.

Perkhidmatan seperti FormSpree, GetForm, FormData, dan Netlify menawarkan ciri-ciri seperti pemberitahuan e-mel, penapisan spam, integrasi pihak ketiga (Zapier), papan pemuka, muat naik fail, dan eksport CSV. Walaupun mudah dan sering menawarkan peringkat percuma, mereka boleh menjadi mahal untuk kegunaan volum tinggi.

Membina Perkhidmatan Anda Sendiri (Manfaat):

Membina penyelesaian tersuai menggunakan pekerja Cloudflare menawarkan:

kos yang lebih rendah setiap penyerahan.

Dasar keselamatan yang disesuaikan.

integrasi perkhidmatan tanpa had.
Latihan yang dikurangkan disebabkan oleh pengkomputeran kelebihan.
fleksibiliti untuk menambah ciri yang tidak tersedia dalam perkhidmatan pihak ketiga.

Pekerja Cloudflare, platform tanpa pelayan, mengelakkan masalah "permulaan sejuk" yang biasa berlaku dalam tawaran tanpa pelayan yang lain, menyediakan masa tindak balas yang hampir-hampir disebabkan oleh arsitektur pengkomputeran V8 dan kelebihannya.

Gambaran keseluruhan projek:

Tutorial ini membimbing anda melalui membina aplikasi pekerja Cloudflare dan mengintegrasikannya dengan spa React Pra-dibina (pautan kod sumber disediakan). Tutorial memberi tumpuan kepada backend pekerja, bukan pembangunan UI.

Prasyarat:

node.js
Visual Studio Code
vs code rest extension client

Persediaan Akaun:

Domain Custom (disyorkan): Domain tersuai memudahkan penggunaan, menyediakan akses log masa nyata, dan meningkatkan kebolehlaksanaan e-mel. Fastcomet dicadangkan untuk pendaftaran domain dan hosting e -mel.
Buat akaun Mailgun (pelan percuma tersedia), sahkannya, perhatikan kunci API dan URL asas anda, dan tambahkan alamat e -mel penerima yang diberi kuasa. Ujian e -mel menghantar menggunakan perintah curl yang disediakan. Domain tersuai disyorkan untuk had penghantaran yang lebih tinggi dan penghantaran peti masuk yang lebih baik.
Daftar untuk akaun pekerja CloudFlare, pasang Wrangler CLI (), log masuk (), dan sahkan pemasangan (npm install -g @cloudflare/wrangler). Jika log masuk gagal, rujuk langkah penyelesaian masalah dalam tutorial asal. Jika menggunakan domain tersuai, tambahkannya ke CloudFlare, tukar Nameservers, dan muat turun/konfigurasi wrangler login. wrangler --version cloudflared

Form Handling for Jamstack Sites Using Cloudflare Workers Pembangunan Projek:

menghasilkan projek: Gunakan wrangler generate cloudflare-form-service, cd cloudflare-form-service, dan npm install. Kemas kini wrangler.toml dengan ID akaun anda dan sediakan skrip dalam package.json untuk pembangunan dan pemformatan.
Mengendalikan permintaan pos: Ubah suai index.js untuk mengendalikan permintaan pos, baca badan permintaan (JSON atau data borang), dan mengembalikan respons yang sesuai (termasuk pengendalian ralat).
Pengesahan skema: Pasang @cfworker/json-schema (npm install @cfworker/json-schema), tukar wrangler.toml ke "type = "webpack", buat validator.js dengan skema JSON dan logik pengesahan, dan mengintegrasikannya ke index.js .
Integrasi e -mel: create email-service.js, email-text-template.js, dan email-html-template.js. Sediakan pembolehubah persekitaran (Kunci API Mailgun, URL Pangkalan API Mailgun, dari alamat e -mel, ke alamat e -mel) menggunakan wrangler secret put atau papan pemuka CloudFlare. Mengintegrasikan email-service.js ke index.js.
Menambah CORS: Tambah corsHeaders ke index.js dan mengendalikan permintaan pilihan preflight untuk memastikan keserasian dengan model keselamatan penyemak imbas.

Penyebaran Projek:

Menyebarkan Perkhidmatan Pekerja Pengendalian Borang: Gunakan wrangler publish untuk digunakan ke Subdomain Workers.Dev Cloudflare. Uji dengan permintaan HTTP yang dikemas kini dalam test.http.
Penyebaran Domain Custom (Pilihan): Sediakan persekitaran pementasan dan pengeluaran dalam wrangler.toml, buat rekod CNAME dalam tetapan DNS CloudFlare anda, dan diterbitkan ke Pengeluaran Menggunakan wrangler publish -e production. Muat naik semula pembolehubah persekitaran menggunakan wrangler secret put. Uji dengan permintaan ke domain tersuai anda.
menggunakan antara muka pengguna borang: Gunakan spa React Spa yang disediakan, konfigurasikan fail .env dengan url aplikasi pekerja anda, dan gunakan ke platform seperti halaman Cloudflare, Netlify, atau Vercel.

Ringkasan dan Soalan Lazim:

Tutorial disimpulkan dengan ringkasan dan seksyen FAQ yang komprehensif yang meliputi jamStack, pekerja Cloudflare, kaedah pengendalian bentuk alternatif, pertimbangan kos, dan batasan. Soalan Lazim juga meneroka ciri dan keupayaan pekerja Cloudflare yang lain. Imej yang disediakan kekal dalam format dan lokasi asalnya.

Atas ialah kandungan terperinci Pengendalian bentuk untuk laman web jamStack menggunakan pekerja Cloudflare. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!