❤ 前端实现发邮件

❤ 前端实现发邮件

1、Nodejs使用nodemailer发邮件

一、开启发送者邮箱的SMTP服务

QQ邮箱开启SMTP服务教程
163邮箱开启SMTP服务教程

二、安装nodemailer模块

在node项目目录下,使用cmd运行下面命令

npm install nodemailer --save

nodemailer官网
https://nodemailer.com/about/

三、根目录下建立一个mailer.js


const nodemailer = require('nodemailer');
let transporter = nodemailer.createTransport({host:'smtp.qq.com', //发送者邮箱服务端口,参考 https://github.com/nodemailer/nodemailer-wellknown/blob/master/services.jsonsecure:true,auth:{user:'111111@qq.com', //发送者邮箱pass:'xyzdawd'  //发送者邮箱授权码,不是登录或者独立密码,是你设置的smtp授权密码},
});let mailOptions = {from:'111111@qq.com', //发送者邮箱to:'a22@163.com', //接受者邮箱,可以设置多个subject:'培训证书', //邮件主题text:'企业培训证书!', //信箱里邮件列表时,此邮件显示的内容说明html:'<b>企业培训证书!</b><br/><img src="cid:00001" alt="证书图片" />', //邮件内容watchHtml: '<b>企业</b> 培训证书!', // Apple Watch specific HTML body 苹果手表指定HTML格式//附件 filename在邮件中附件显示的名字,content附件的内容,contentType附件的类型,cid附件的id//关于附件的更多用法以及属性说明,参考 https://nodemailer.com/message/attachments/attachments: [// String attachment{filename: 'notes.txt',content: 'Some notes about this e-mail',contentType: 'text/plain' // 可选,会检测文件名},
]
transporter.sendMail(mailOptions,(err,info)=>{if(err){console.log(err);}else{console.log(info);}
});

四、运行

修改配置文件以后,在根目录下命令行执行(切记是命令行来执行

使用 node mailer.js 运行程序

五、项目中使用

安装 axios
npm install axios 

注意:

1.建议不要用163邮箱作为发送方
因为163的反垃圾机制,用163向qq邮箱发送,html内容有图片,携带附件的时候,会报错误
Error: Message failed: 554 DT:SPM 163 smtp11, 导致发送失败。目前我使用QQ作为发送方。
2.两个填写发件人账号的地方要写一致,不然会导致如下错误,504,SUM 信封发件人和信头发件人不匹配
Error: Message failed: 554 DT:SPM 126 smtp7

2、emailjs实现发邮件

限制

emailjs邮箱(没有需要注册一个)
需要node的环境,安装emailjs,如下

在前端使用 EmailJS 发送邮件是一种方便的方式,EmailJS 是一个允许你通过前端直接发送电子邮件的服务。以下是一个简单的步骤指南来帮助你在前端使用 EmailJS 发送邮件:

步骤一:注册 EmailJS 账户

访问 EmailJS 官方网站 并注册一个账户。
创建一个项目并获取你的 User ID。

步骤二:安装 EmailJS SDK

通过 npm 安装 EmailJS SDK:

npm install emailjs-com

步骤三:在前端代码中使用 EmailJS 发送邮件

import emailjs from 'emailjs-com';// 使用你在 EmailJS 上获得的 User ID 和 Service ID
const USER_ID = 'your_user_id';
const SERVICE_ID = 'your_service_id';// 发送邮件的函数
function sendEmail() {emailjs.send(SERVICE_ID, 'template_id', {to_name: 'Recipient Name',message: 'This is a test email sent from EmailJS.'}, USER_ID).then((response) => {console.log('Email sent:', response);}, (error) => {console.error('Error sending email:', error);});
}// 调用发送邮件函数
sendEmail();

注意事项:
替换 your_user_id 和 your_service_id 分别为你在 EmailJS 上获取的 User ID 和 Service ID。
替换 ‘template_id’ 为你在 EmailJS 上创建的模板 ID。
在 emailjs.send 方法中,可以传递邮件的参数,例如收件人名称、消息内容等。
请确保在发送邮件之前配置好你的 EmailJS 服务和模板,并替换代码中的相应参数。这样就可以在前端使用 EmailJS 发送邮件了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/720831.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ShardingSphere-SQL 解析 Issue 处理流程

ShardingSphere-SQL 解析 Issue 处理流程 这是之前给社区写的 SQL 解析 Issue 的处理流程&#xff0c;可以帮助社区用户快速参与到 ShardingSphere-SQL 解析任务当中。 ShardingSphere SQL 解析 issue 列表 Issue 背景说明 当前 Issue 使用自定义的爬虫脚本从对应的数据库官…

MySQL-----视图

一 视图 ▶ 介绍 视图view是一个虚拟表&#xff0c;非真实存在&#xff0c;其本质是根据SQL语句获取动态的数据集&#xff0c;并为其命名&#xff0c;用户使用时只需使用视图名称即可获取结果集&#xff0c;并可以将其当作表来使用。 数据库中存放了视图的定义&…

Java程序员修炼之道 之 Logging

1. 一个最基本的例子 使用Logging框架写Log基本上就三个步骤 引入loggerg类和logger工厂类 声明logger 记录日志 下面看一个例子 //1. 引入slf4j接口的Logger和LoggerFactory import org.slf4j.Logger; import org.slf4j.LoggerFactory; public class UserService { //…

轻量级Redis慢查询监控脚本

Redis是一款非常强大的内存数据库&#xff0c;可以用于缓存、事务、队列等多种场景。但是在使用Redis的过程中&#xff0c;可能会遇到慢查询的问题。为了提高Redis的性能和响应速度&#xff0c;我们需要了解和处理慢查询。本文将围绕分享Redis慢查询脚本这一主题&#xff0c;讲…

ts快速上手笔记02

第二章&#xff1a;面向对象 面向对象是程序中一个非常重要的思想&#xff0c;它被很多同学理解成了一个比较难&#xff0c;比较深奥的问题&#xff0c;其实不然。面向对象很简单&#xff0c;简而言之就是程序之中所有的操作都需要通过对象来完成。 举例来说&#xff1a; 操作…

C#封装常用的Redis工具类

1.请先安装CSRedisCore 接口&#xff1a; namespace Tools.Redis {public interface IRedisTool{bool SetLongValue(string key, string value);bool SetValue(string key, string value, int outSecond);bool SetValue(string key, string value);bool Exists(string key);b…

揭开ChatGPT的智能对话奥秘——深度剖析其工作原理与关键技术

导语 让我们携手走进一个极具革新性的科技前沿领域&#xff0c;一同揭示能够与人类实现自然流畅对话的ChatGPT背后的运作机制。它犹如一个拥有无尽智慧的对话伙伴&#xff0c;跨越知识边界&#xff0c;回应各种疑问&#xff0c;并能创作出精辟的文章和诗篇。那么&#xff0c;C…

TDengine Schemaless常见问题的原因及故障排除

Tips&#xff1a;使用版本&#xff1a;3.0.2.6 &#xff08;一&#xff09;TDengine ERROR (80003002): Invalid data format 格式化问题&#xff1b;如缺少必要的组成格式&#xff08;时间戳、超级表等&#xff09;&#xff0c;或有字符串未作修饰符修饰&#xff0c;类似的还…

js和css阻塞问题

面试常见问题 css 加载会不会阻塞 js 的加载&#xff1f;&#xff08;不会&#xff09;css 加载会不会阻塞 js 的执行&#xff1f;&#xff08;会&#xff09;css 加载会不会阻塞 DOM 的解析&#xff1f;&#xff08;不会&#xff09;css 加载会不会阻塞 DOM 的渲染&#xff1…

解析Excel数据如虎添翼:Excel数据监听器助你快速解析数据,轻松驾驭业务需求,一键解析,风云再起,数据处理从未如此简单,事半功倍

以下代码是一个Excel数据监听器&#xff0c;用于监听和处理Excel数据的读取事件。它实现了AnalysisEventListener接口&#xff0c;并重写了其中的方法。以下是代码中的主要部分&#xff1a; invokeHead方法&#xff1a;在解析Excel表格的表头时触发的回调方法。通过比较模板表…

企业数字人虚拟形象定制解决方案

随着数字化浪潮的推进&#xff0c;虚拟形象在各个领域都展现出了强大的潜力&#xff0c;美摄科技作为业界领先的数字人虚拟形象定制解决方案提供商&#xff0c;致力于为企业打造独一无二的虚拟形象&#xff0c;助力企业在数字世界中塑造独特的品牌形象。 一、解决方案概览 美…

理德外汇名人故事:个人投资者大使——威廉·欧奈尔

威廉•欧奈尔&#xff08;William J.O’Neil&#xff09;是美国著名的成长性企业的投资大师&#xff0c;投资生涯接近50年。1988年&#xff0c;出版《How to Make Money in Stocks: A winning system in good times or bad》一书&#xff0c;国内译为《笑傲股市》&#xff0c;成…

02-prometheus监控-服务器节点监控node-exporter

一、概述 prometheus&#xff0c;本身是一个【数据收集】和【数据处理】的工具&#xff0c;如果效果要监控一台服务器物理机&#xff0c;有两种方式&#xff0c;一种是在物理机上部署“node-export”来收集数据上报给prometheus&#xff0c;另一种是“自定义监控”&#xff1b;…

SqlServer 默认值约束示例

创建表&#xff0c;创建时指定 money 字段默认值为0.00&#xff1b; create table t_24 ( account varchar(19) not null, id_card char(18) not null, name varchar(20) not null, money decimal(16,2) default 0.00 not null ); 录入2条记录&#xff0c;money字…

YoloV8改进策略:卷积改进|MogaNet——高效的多阶门控聚合网络

文章目录 摘要论文:《MogaNet——高效的多阶门控聚合网络》1、简介2、相关工作2.1、视觉Transformers2.2、ViT时代的卷积网络3、从多阶博弈论交互的角度看表示瓶颈4、方法论4.1、MogaNet概述4.2、多阶门控聚合4.3、通过通道聚合进行多阶特征重新分配4.4、实现细节5、实验5.1、…

HTML极速入门

HTML基础 什么是HTML HTML(Hyper Text Markup Language),超文本标记语言. 超文本:比文本更强大.通过链接和交互式方式来组织和呈现信息的文本形式.不仅仅有文本,还可能包括图片,音频,或者自己经审阅过它的学者所加的评注,补充或脚注等. 标记语言:由标签构成的语言 HTML的标…

es6 相关面试题

1 var, let ,const 区别&#xff1f; 2 手写将对象进行合并 手写合并对象 3 普通函数和箭头函数区别&#xff1f; 4 find 和 filter的区别&#xff1f; 5 some和every区别&#xff1f;

ES核心概念(45-48)(56-62)(101-103)

ES集群 ES集群&#xff08;Cluster&#xff09;包含多个节点&#xff08;服务器&#xff09;&#xff0c;整体提供服务 核心概念 索引Index&#xff1a;类似于mysql中的表 映射Mapping:数据的结构信息 文档&#xff1a;相当于表中的一条记录 分片&#xff1a; 将数据分成多片…

Transformer、BERT和GPT 自然语言处理领域的重要模型

Transformer、BERT和GPT都是自然语言处理领域的重要模型&#xff0c;它们之间有一些区别和联系。 区别&#xff1a; 架构&#xff1a;Transformer是一种基于自注意力机制的神经网络架构&#xff0c;用于编码输入序列和解码输出序列。BERT&#xff08;Bidirectional Encoder R…

java 面试题总结

1锁粗化和锁消除&#xff0c;锁膨胀和锁升级的区别。 https://www.cnblogs.com/xuxinstyle/p/13387778.html .无锁 < 偏向锁 < 轻量级锁 < 重量级锁 &#xff0c;说的时候不要忘记说无锁状态 2.Map 的实现&#xff0c;线程安全的实现 1、ConcurrentHashMap在JDK 1.7…