首页 > web前端 > css教程 > 收集使用概念API的电子邮件注册

收集使用概念API的电子邮件注册

William Shakespeare
发布: 2025-03-19 10:12:11
原创
569 人浏览过

该教程演示了使用Jamstack架构,集成NetLify功能,Intion API和MailGun的新闻通讯注册系统。让我们探索如何直接收集电子邮件订阅者,为已建立的新闻通讯平台提供免费的自托管替代方案。

收集使用概念API的电子邮件注册

许多人今天创建了新闻通讯,利用替代,MailChimp,Revue(Twitter)甚至Facebook等服务。其他人则选择自我管理的WordPress解决方案,例如MailPoet。本教程提出了一种不同的方法:一种用于使用HTML表单,无服务器功能和数据库收集电子邮件地址的自定义系统。此方法避免了与许多现有平台相关的成本。

本教程使用NetLify函数,一个概念数据库和邮件枪构建系统(尽管可以替换任何API启用的电子邮件服务)。所有服务提供免费层(具有限制)。完整的代码可在GitHub上找到。

概念:您的数据库解决方案

概念是我们的数据库。这是一个多功能工作空间,用于笔记,项目管理等。它的数据库功能,可通过用户友好的界面访问,是存储我们的电子邮件订阅的理想选择。我们将创建一个名为“新闻通讯电子邮件”的表(数据库),并使用简单的“电子邮件”列和概念的内置“创建时间”属性。

概念API令牌和集成

要连接到概念数据库,请创建一个概念集成(不在您的概念帐户中,而是在登录时在概念网站上)。将其命名为“新闻通讯注册”并获得内部集成令牌(API令牌)。至关重要的是,与此集成共享“新闻通讯电子邮件”数据库以授予访问权限。

NetLify功能:无服务器功率

NetLify功能提供无服务器API端点。虽然可以使用Netlify表格,但免费层限制提交至每月100。但是,NetLify功能提供了更高的调用限制(免费计划中的125,000个),使其适合处理大量的电子邮件注册。

设置NetLify项目

安装NetLify CLI( npm install netlify-cli -g ),创建项目目录,初始化NPM( npm init ),并使用NetLify进行身份验证。需要一个netlify.toml文件来指定功能目录( functions = "functions" )。

NetLify函数(index.js)

此功能处理表单提交。安装@notionhq/client软件包( npm install @notionhq/client --save )。使用您的intion api令牌( NOTION_API_TOKEN )和数据库ID( NOTION_DATABASE_ID )创建.env文件。数据库ID可在数据库的概念URL中找到。

index.js函数验证了电子邮件地址,使用概念API将电子邮件添加到数据库中,并返回成功或错误响应。

HTML表格(index.html)

使用电子邮件输入和提交按钮的简单HTML表单。 JavaScript代码验证了电子邮件,并将发布请求发送到NetLify函数( /.netlify/functions/index )。 Bootstrap 5用于造型。

MailGun集成(Welcome.js)

要发送确认电子邮件,请集成MailGun(或类似的服务)。从MailGun仪表板获取您的MailGun API密钥和域,将它们添加到.env文件中,为MAILGUN_API_KEYMAILGUN_DOMAIN

安装mailgun-js软件包( npm install mailgun-js --save )。创建一个welcome.js netlify函数,以从概念(在过去30分钟内)获取新的注册,并使用Mailgun API发送确认电子邮件。

测试和下一步

测试表单,验证数据库条目,然后使用Postman等工具将POST请求发送到welcome功能。请记住检查您的垃圾邮件文件夹以获取确认电子邮件。

未来的改进包括实施计划的任务(例如,使用GitHub操作)定期发送欢迎电子邮件并向welcome端点添加安全措施。

本教程为建立新闻通讯注册系统提供了强大,成本效益和教育的方法。该过程展示了组合各种服务和API以创建功能应用程序的力量。

以上是收集使用概念API的电子邮件注册的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板