什麼是SmtpJS？
SmtpJS是一款通過前端js代碼發送郵件的插件，導入插件後，只需簡單幾行代碼就能實現郵件發送。當然了，由於是前端，其安全性自然比後端javamail封裝等弱一點，不過SmtpJS十分簡易方便，強力安利。
開通POP3/SMTP服務
在介紹SmtpJS使用前，我們需要先準備一個開通POP3/SMTP服務的郵箱，如果已有，可以跳過此步驟。
我們以QQ郵箱爲例，登錄QQ郵箱後，設置->賬戶
找到POP3/SMTP服務點擊開啓
完成相應密保驗證
之後獲取對應授權碼。
至此你的QQ郵箱就開通了POP3/SMTP服務。
導入插件
去到SmtpJS官網下載smtp.js
我也上傳到了github
如果不想下載的話也可以用官網地址，不過還是推薦前者。
<script src="https://smtpjs.com/v3/smtp.js">
</script>
發送郵件
參數說明
| 參數 | 說明 |
|---|---|
| Host | 你所用郵箱的smtp地址 |
| Username | 你的郵箱用戶名（如[email protected]） |
| Password | 你的郵箱密碼(之前開通服務的授權碼) |
| To | 收件人郵箱地址 |
| From | 發件人郵箱地址 |
| Subject | 郵件主題 |
| Body | 郵件內容 |
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>發送郵件測試</title>
<%
pageContext.setAttribute("APP_PATH",request.getContextPath());
%>
<script type="text/javascript" src="${APP_PATH}/static/js/smtp.js"></script>
</head>
<body>
<script type="text/javascript">
Email.send({
Host : "smtp.yourisp.com",
Username : "username",
Password : "password",
To : '[email protected]',
From : "[email protected]",
Subject : "This is the subject",
Body : "And this is the body"
}).then(
message => alert(message)
);
</script>
</body>
</html>
至此我們就成功的發送了郵件！(。・∀・)ノ
附上各郵箱的端口及smtp地址：
| 郵箱 | pop地址 | smtp地址 | 端口 |
|---|---|---|---|
| 188 郵箱 | pop3.188.com | smtp.188.com | 25 |
| 163 郵箱 | pop3.163.com | smtp.163.com | 25 |
| 126 郵箱 | pop3.126.com | smtp.126.com | 25 |
| netease 郵箱 | pop.netease.com | smtp.netease.com | 25 |
| yeah 郵箱 | pop.yeah.net | smtp.yeah.net | 25 |
| QQ 郵箱 | pop.qq.com | smtp.qq.com | 465或587 |
| 網易企業郵箱 | pop3.163.com | smtp.qiye.163.com | 994 |
| 騰訊企業郵箱 | pop.qq.com | smtp.exmail.qq.com | 25 |
加密SMTP
在官網點擊Encrypt your SMTP Credentials
仍以QQ郵箱爲例，點擊Generate security token
然後生成了一個密鑰
替換成你的密鑰即可
Email.send({
SecureToken : "密鑰",
To : '[email protected]',
From : "[email protected]",
Subject : "This is the subject",
Body : "And this is the body"
}).then(
message => alert(message)
);
含附件
即多一個Attachments參數
Email.send({
SecureToken : "密鑰",
To : '[email protected]',
From : "[email protected]",
Subject : "This is the subject",
Body : "And this is the body",
Attachments : [
{
name : "smtpjs.png",
path : "https://networkprogramming.files.wordpress.com/2017/11/smtpjs.png"
}]
}).then(
message => alert(message)
);
你的點贊將會是我最大的動力