Tutorial ini menunjukkan membina sistem pendaftaran surat berita menggunakan seni bina jamStack, mengintegrasikan fungsi Netlify, API tanggapan, dan Mailgun. Mari kita meneroka bagaimana untuk mengumpul pelanggan e-mel secara langsung, menawarkan alternatif yang bebas dan menjadi tuan rumah kepada platform surat berita yang ditubuhkan.
Ramai individu membuat surat berita hari ini, memanfaatkan perkhidmatan seperti Subtack, MailChimp, Revue (Twitter), dan juga Facebook. Orang lain memilih penyelesaian WordPress yang diuruskan sendiri seperti MailPoet. Tutorial ini membentangkan pendekatan yang berbeza: Sistem tersuai untuk mengumpul alamat e -mel menggunakan borang HTML, fungsi tanpa pelayan, dan pangkalan data. Kaedah ini mengelakkan kos yang berkaitan dengan banyak platform sedia ada.
Tutorial ini membina sistem menggunakan fungsi Netlify, pangkalan data tanggapan, dan Mailgun (walaupun mana-mana perkhidmatan e-mel yang dibolehkan API boleh digantikan). Semua perkhidmatan menawarkan peringkat percuma (dengan batasan). Kod lengkap boleh didapati di GitHub.
Pengertian: Penyelesaian pangkalan data anda
Pengertian berfungsi sebagai pangkalan data kami. Ia adalah ruang kerja yang serba boleh untuk pengambilan nota, pengurusan projek, dan banyak lagi. Fungsi pangkalan datanya, boleh diakses melalui antara muka mesra pengguna, sangat sesuai untuk menyimpan langganan e-mel kami. Kami akan membuat jadual (pangkalan data) yang dipanggil "e-mel surat berita," dengan lajur "e-mel" yang mudah dan harta "masa yang dicipta" terbina dalam.
Token API dan integrasi
Untuk menyambung ke pangkalan data tanggapan, buat integrasi tanggapan (bukan dalam akaun tanggapan anda, tetapi di laman web tanggapan semasa log masuk). Namakan "pendaftaran surat berita" dan dapatkan token integrasi dalaman (token API). Secara kritis, kongsi pangkalan data "e -mel surat berita" dengan integrasi ini untuk memberikan akses.
Netlify Fungsi: Kekuatan tanpa pelayan
Fungsi Netlify menyediakan titik akhir API tanpa pelayan. Walaupun borang Netlify boleh digunakan, Tahap Percuma mengehadkan penyerahan kepada 100 sebulan. Fungsi Netlify, bagaimanapun, menawarkan had penyerahan yang lebih tinggi (125,000 sebulan pada pelan percuma), menjadikannya sesuai untuk mengendalikan jumlah pendaftaran e -mel yang lebih besar.
Menyediakan Projek Netlify
Pasang Netlify CLI ( npm install netlify-cli -g
), buat direktori projek, memulakan NPM ( npm init
), dan mengesahkan dengan Netlify. Fail netlify.toml
diperlukan untuk menentukan direktori fungsi ( functions = "functions"
).
Fungsi Netlify (index.js)
Fungsi ini mengendalikan penyerahan borang. Pasang pakej @notionhq/client
( npm install @notionhq/client --save
). Buat fail .env
dengan token API tanggapan anda ( NOTION_API_TOKEN
) dan id pangkalan data ( NOTION_DATABASE_ID
). ID pangkalan data terdapat dalam url tanggapan pangkalan data.
Fungsi index.js
mengesahkan alamat e -mel, menggunakan API tanggapan untuk menambah e -mel ke pangkalan data, dan mengembalikan tindak balas kejayaan atau ralat.
Borang HTML (index.html)
Borang HTML yang mudah dengan input e -mel dan butang hantar dibuat. Kod JavaScript mengesahkan e -mel dan menghantar permintaan pos ke fungsi Netlify ( /.netlify/functions/index
). Bootstrap 5 digunakan untuk gaya.
Integrasi Mailgun (selamat datang.js)
Untuk menghantar e -mel pengesahan, mengintegrasikan Mailgun (atau perkhidmatan serupa). Dapatkan kekunci API Mailgun dan domain anda dari papan pemuka Mailgun, menambahkannya ke fail .env
anda sebagai MAILGUN_API_KEY
dan MAILGUN_DOMAIN
.
Pasang pakej mailgun-js
( npm install mailgun-js --save
). Buat Fungsi Netlify welcome.js
untuk mengambil pendaftaran baru dari tanggapan (dalam masa 30 minit terakhir) dan hantar e -mel pengesahan menggunakan API Mailgun.
Ujian dan langkah seterusnya
Uji borang, sahkan penyertaan pangkalan data, dan hantar permintaan pos ke fungsi welcome
menggunakan alat seperti Postman. Ingatlah untuk memeriksa folder spam anda untuk e -mel pengesahan.
Penambahbaikan masa depan termasuk melaksanakan tugas yang dijadualkan (misalnya, menggunakan tindakan GitHub) untuk kerap menghantar e -mel selamat datang dan menambah langkah -langkah keselamatan ke titik akhir welcome
.
Tutorial ini menyediakan pendekatan yang mantap, kos efektif, dan pendidikan untuk membina sistem pendaftaran surat berita. Proses ini menunjukkan kuasa menggabungkan pelbagai perkhidmatan dan API untuk membuat aplikasi berfungsi.
Atas ialah kandungan terperinci Mengumpulkan pendaftaran e -mel dengan API Pengertian. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!