今天,我一直在研究一个非常简单的HTML联系人表单,该表单应该可以使用Node.js和Gulp发送电子邮件,但是我无法找到一种实现此目的的方法。一个简单的.PHP文件的相对路径不是正确的方法,它可能应该通过HTTP请求,但实际上
我不知道如何用Gulp做到这一点。如何将表单数据从HTML发送到Gulp任务?还是我需要首先使用JavaScript来捕获表单提交?
请参见下面的HTML代码:
<form action="What needs to be here now?" method="POST">
<h3 class="title is-4 has-text-centered">Uw onderneming aanmelden</h3>
<div class="control-material is-secondary">
<input class="material-input" type="text" required>
<span class="material-highlight"></span>
<span class="bar"></span>
<label>Name *</label>
</div>
<div class="control-material is-secondary">
<input class="material-input" type="text" required>
<span class="material-highlight"></span>
<span class="bar"></span>
<label>Company name *</label>
</div>
<div class="control-material is-secondary">
<input class="material-input" type="text" required>
<span class="material-highlight"></span>
<span class="bar"></span>
<label>Phone *</label>
</div>
<div class="control-material is-secondary">
<input id="email" name="email" class="material-input" type="text" required>
<span class="material-highlight"></span>
<span class="bar"></span>
<label>E-mail *</label>
</div>
<div class="submit-wrapper">
<button type="submit" class="button button-cta is-bold is-fullwidth btn-align primary-btn raised no-lh">
Join
</button >
</div>
答案 0 :(得分:1)
您的策略将取决于您是否希望表单在不与服务器进行任何交互的情况下在客户端触发电子邮件。或者是否要将该表单提交到服务器,然后让服务器发送电子邮件。
仅限客户端:
您的“加入”按钮可能会触发JavaScript函数,该函数阻止默认的表单提交,而是检索表单条目并生成复杂的mailto:
地址:
function sendEmail() {
// Write some code that gets form entries
window.location.href = 'mailto:' + address + '?subject=' + ...;
}
(有lots of web resources个用于学习复杂的mailto:
地址的信息。)这将导致用户偏爱的邮件客户端打开,并用您指定的内容填充电子邮件。用户在其客户端中单击“发送”,电子邮件即被发送,而无需您的服务器参与。
服务器端控件:
执行此操作的方法有很多种,但第一种简单的方法是使用Nodemailer之类的Node.js程序包。设置您的服务器以通过POST请求路由接收多部分表单数据,然后让您的服务器将该数据转换为邮件内容并转换为Nodemailer
transporter.sendMail
命令。与客户端不同,您将需要在自己的smtp
服务器或gmail
之类的服务上设置专用的电子邮件发件人帐户,以供服务器使用。< / p>
或者,如果您希望服务器仅充当中介机构而不发送自己的电子邮件,则可以使用SendAPI,Mailgun等电子邮件API进行注册。然后,服务器会使用提交给您的数据的API来访问其API。 POST路由,他们将发送电子邮件。