js发送邮件

前言: 首先在开发前需要了解JS是没有提供直接操作Email的接口,所以我们只能通过JS操作第三方的接口来web前端的邮件发送功能,下面列举能够在通过前端实现邮件发送的几种方式:

方式一:

send mail

方式一的实现方式是,需要在客户端安装一个邮件客户端软件,比如 Foxmail,Outlook,YoMail之类的,mailto等于就是调用本机的邮件客户端,来进行发送邮件,缺点:用户电脑必须存在一个邮件客户端。

方式二:

nodeemail

方式二是通过node.js中的nodeEmail邮件接口来实现邮件发送,此必须先安装node.js,该方式目前使用得挺多的,也挺简单,具体操作网上蛮多。

方式三:

jMail

方式三是通过调用jMail服务接口实现邮件发送,需要下载运行jMail.dll文件安装服务,有点复杂,感觉跟java实现邮件发送的原理差不多,不太推荐大家使用这种方式,

需要处理的问题蛮多,比如:浏览器兼容问题,POP/IMAP 开启,host配置之类的,对于不太熟悉的可能花上好几小时都不一定有成果。

方式四:

EmailJS

emailJS跟nodeemail的实现方式差不多,需要安装npm,代码相当少,而且能够在EmailJS个人账户中配置发送的模板,以及查看发送的邮件日志,还是挺方便的。唯一的缺点就是在注册EmailJS账户和配置时需要连接连接海外网络,在使用时不需要海外网络。

下面讲讲EmailJS的使用:

代码大概也就这么几行

var service_id = 'my_mandrill';

var template_id = 'feedback';var template_params = {name: 'John',reply_email: '[email protected]',message: 'This is awesome!'};emailjs.send(service_id,template_id,template_params);

EmailJS官网地址:https://www.emailjs.com ,登录官网创建一个账户,绑定邮箱,邮箱最好是gmail或者其他常用的海外邮箱,

注册完之后大概像这样

js发送邮件_第1张图片

官网给出的指南,只有三步很简单的

1. CONNECT YOUR EMAIL SERVICE
Choose from a wide variety of email services. We support both 
transactional email services (Mailgun, Mailjet, Mandrill, SendGrid, Amazon SES and Postmark) and personal email services (AOL, Gmail, FastMail, iCloud, Mail.ru, Outlook, Yahoo, Yandex and Zoho). 
1.需要创建一个私人的邮件服务器[在Email Services中创建一个personal service ,关联你的gmail邮箱],完成后你就可以测试是否可以使用Test
2. CREATE EMAIL TEMPLATES
Choose from a list of our template designs, or easily build your own. 
Templates are parametrized, so that you can further customize them via Javascript.
2.创建一个需要发送邮件的邮件模板
3. SEND EMAIL WITH OUR JAVASCRIPT API 参照API进行写js调用EmailJS接口,实现邮件发送。
Add our Javscript SDK, and start sending emails!

邮件模板的设置

js发送邮件_第2张图片


在命令窗口检查是否已经安装npm ,没有就百度哈,很简单的,最简单的方式就是直接安装node.js,node.js会自动安装npm, 单独安装npm好像也可以,但是我没试过。

C:\Users\my>npm -v
'npm' 不是内部或外部命令,也不是可运行的程序
或批处理文件。】

然后运行,

Install EmailJS SDK using npm:

$ npm install emailjs-com --save

安装EmailJS SDK,

在使用EmailJS需要引入js文件

JS 语法


其他功能

邮件日志发送记录 , 以及使用情况的曲线图等。

js发送邮件_第3张图片


大家要是有其他好的js发送邮件的方式,期待大家一起交流。




你可能感兴趣的:(js,html5)