前言
这个前台用的框架比较小众，是H-ui，参考的时候可以适当忽略页面，重点放在js上就行了
框架用的是springboot
导入相关依赖
<!--邮件发送-->
<dependency>
<groupId>javax.mail</groupId>
<artifactId>mail</artifactId>
<version>1.4.5</version>
</dependency>
在springboot中配置MultipartResolver
注：这里是因为我使用了Spring的MultipartFile来接受文件上传才要配置的
//配置文件上传
@Bean(name = "multipartResolver")
public MultipartResolver multipartResolver() {
CommonsMultipartResolver resolver = new CommonsMultipartResolver();
resolver.setDefaultEncoding("UTF-8");
// resolveLazily属性启用是为了推迟文件解析，以在在UploadAction中捕获文件大小异常
resolver.setResolveLazily(true);
resolver.setMaxInMemorySize(40960);
// 上传文件大小 5G
resolver.setMaxUploadSize(5 * 1024 * 1024 * 1024);
return resolver;
}
前台和js
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>邮件发送</title>
<link rel="stylesheet" type="text/css" href="../static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="../static/lib/Hui-iconfont/1.0.9/iconfont.css" />
<style>
body{
background-color: #F0F2F5;
}
.container{
padding: 20px;
}
.panel{
background-color: white;
}
.panel-body div{
//border:1px dashed #000;
}
textarea{
overflow: hidden;
resize: none;
}
</style>
</head>
<body>
<div class="container">
<div class="panel mt-20">
<div class="panel-body">
<legend>收件人列表</legend>
<div class="mt-20 clearfix">
<table class="table table-border table-bordered table-bg table-sort">
<thead>
<tr class="text-c">
<th width="70">供应商编号</th>
<th width="80">供应商名称</th>
<th width="150">公司地址</th>
<th width="120">业务范围</th>
<th width="120">负责人</th>
<th width="120">负责人联系方式</th>
<th width="100">邮箱</th>
</tr>
</thead>
<tbody>
<tr class="text-c">
<td>1</td>
<td>金坷垃化肥有限公司</td>
<td>圣地亚哥</td>
<td>金坷垃化肥及相关农业产品生经营生产</td>
<td>王二狗</td>
<td>12345678901</td>
<td class="sup-email">xxxx@163.com</td>
</tr>
<tr class="text-c">
<td>2</td>
<td>金坷垃化肥有限公司</td>
<td>圣地亚哥</td>
<td>金坷垃化肥及相关农业产品生经营生产</td>
<td>王二狗</td>
<td>12345678901</td>
<td class="sup-email">xxxxx@qq.com</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel mt-20">
<div class="panel-body">
<legend>填写邮件</legend>
<div class="form form-horizontal" id="form-article-add">
<div class="row clearfix">
<label class="form-label col-sm-2"><span class="c-red">*</span>邮件标题：</label>
<div class=" col-sm-7">
<input type="text" class="input-text radius size-M" id="mailtitle" name="mailtitle" placeholder="请输入邮件标题">
</div>
</div>
<div class="row clearfix">
<label class="form-label col-sm-2"><span class="c-red">*</span>文件上传：</label>
<div class="col-sm-7">
<input type="text" class="input-text radius" id="fileurl" readonly="readonly" placeholder="请上传附件">
</div>
<div class="col-sm-2">
<span class="btn-upload">
<a href="javascript:void();" class="btn btn-primary radius btn-upload"><i class="Hui-iconfont"></i> 浏览文件</a>
<input type="file" multiple name="file_0" id="input-file" class="input-file" onchange="getFileUrl()">
</span>
</div>
</div>
<div class="row clearfix">
<label class="form-label col-sm-2">邮件内容：</label>
<div class="form-controls col-sm-7">
<textarea class="textarea textarea-article radius" id="content" placeholder="请输入邮件内容"></textarea>
</div>
</div>
<div class="row clearfix">
<div class="col-md-3 col-offset-2">
<button class="btn btn-block btn-primary radius" onclick="uplaodFile()">上传</button>
</div>
<div class="col-md-3 col-offset-1">
<button class="btn btn-block btn-danger radius" onclick="closeLoadtip()">取消</button>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript" src="../static/lib/jquery/1.9.1/jquery.js"></script>
<script type="text/javascript" src="../static/h-ui/js/H-ui.js"></script>
<script type="text/javascript" src="../static/lib/layer/3.1.1/layer.js"></script>
<script type="text/javascript">
/*获取文件上传路径并放入文本框*/
function getFileUrl() {
var FileInput = document.getElementById("input-file");
var FileUrlInput = document.getElementById("fileurl");
FileUrlInput.value = FileInput.value;
}
/*文件上传*/
function uplaodFile() {
//获取商家的email列表
var mailList = ";";
$(".sup-email").each(function(){
mailList=mailList+ $(this).text()+";";
});
//将上传组件添加进临时表单
var form = new FormData();
form.append("title",document.getElementById("mailtitle").value);
if (document.getElementById("input-file").value != ""){
form.append("file", document.getElementById("input-file").files[0]);
}
form.append("content",document.getElementById("content").value);
form.append("email",mailList);
//弹出加载提示
loadtip();
//提交表单
$.ajax({
url: "http://localhost:8080/mail_send",
data: form,
cache: false,
async: false,
type: "POST",
dataType: 'json',
processData: false,
contentType: false,
success: function (data) {
//关闭加载提示
closeLoadtip();
var status = data["status"]
if(status == "success"){
layer.msg('邮件发送成功！');
}else {
layer.msg('"邮件发送失败！"');
}
},
error: function (err) {
console.log(err);
layer.msg('"网络连接异常！"');
}
});
}
/*弹出加载提示层*/
var loadTipIndex;
function loadtip() {
loadTipIndex = layer.load(1, {
shade: [0.1,'#fff'] //0.1透明度的白色背景
});
}
/*关闭加载提示层*/
function closeLoadtip() {
layer.close(loadTipIndex);
}
</script>
controller(service)
注：嫌麻烦没写service，自己用的话最好老老实实写接口再实现
import com.sanyu.tender.util.mailSend.MailSend;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;
/**
* @Author：huang
* @Date：2019-09-18 18:55
* @Description：<描述>
*/
@Controller
public class sendMailController {
@Autowired
private MailSend mailSend;
@RequestMapping("/mail_send_show")
public String showSendMail(){
return "mail-send";
}
//接受文件上传
@RequestMapping("/mail_send")
@ResponseBody
public Map sendMail(String title,String content,String email,MultipartFile file){
Map<String,Object> map = new HashMap<>(16);
//获取地址字符串并截取放入集合
ArrayList<String> list = new ArrayList<>();
String[] emailArr = email.split(";");
for (int i = 1;i<emailArr.length;i++){
list.add(emailArr[i]);
}
map.put("status","success");
try {
mailSend.send(list,title,content,file);
}catch (Exception e){
e.getStackTrace();
map.put("status","false");
}
return map;
}
}
javaMail邮件发送工具类代码
/**
* @Author：huang
* @Date：2019-09-17 20:29
* @Description：邮件发送工具类
*/
@Component
public final class MailSend {
//发件人账号和授权码
private static final String MY_EMAIL_ACCOUNT = "xxxx@163.com";
private static final String MY_EMAIL_PASSWORD = "xxxx";
//SMTP服务器(这里用的163 SMTP服务器)
private static final String MEAIL_163_SMTP_HOST = "smtp.163.com";
//端口号
private static final String SMTP_163_PORT = "25";
//message对象
private MimeMessage message;
{
//创建发件邮箱对象
Properties properties = new Properties();
properties.setProperty("mail.smtp.host", MEAIL_163_SMTP_HOST);
properties.setProperty("mail.smtp.port", SMTP_163_PORT);
properties.setProperty("mail.smtp.socketFactory.port", SMTP_163_PORT);
properties.setProperty("mail.smtp.auth", "true");
properties.setProperty("mail.smtp.socketFactory.class", "SSL_FACTORY");
//登录
Session session = Session.getInstance(properties, new Authenticator() {
// 设置认证账户信息
@Override
protected PasswordAuthentication getPasswordAuthentication() {
return new PasswordAuthentication(MY_EMAIL_ACCOUNT, MY_EMAIL_PASSWORD);
}
});
session.setDebug(false);
//创建邮件对象
System.out.println("创建发件人邮箱");
message = new MimeMessage(session);
}
/**
* 发送邮件
* @param to 收件人邮箱的集合
* @param title 邮件标题
* @param content 邮件内容
* @param file 通过表单上传的MultipartFile文件
* @return 根据方法执行情况返回一个Boolean类型的值
*/
public boolean send(ArrayList<String> to, String title, String content,MultipartFile file){
File tempFile = null;
try {
//发件人
message.setFrom(new InternetAddress(MY_EMAIL_ACCOUNT));
//收件人
setAccepter(to);
//标题
message.setSubject(title);
//当存在附件的情况下，内容将和附件一起上传
if (file != null){
//添加附件和内容
tempFile = getFile(file);
setMultipartAndContent(tempFile,content);
}else {
//内容
message.setContent(content, "text/html;charset=UTF-8");
}
//发送时间
message.setSentDate(new Date());
message.saveChanges();
} catch (MessagingException e) {
e.printStackTrace();
return false;
}
//发送邮件
System.out.println("准备发送");
try {
Transport.send(message);
//当存在附件的情况下发送完邮件以后删除上传到服务器的文件
if (file != null){
deleteServerFile(tempFile);
}
} catch (MessagingException e) {
e.printStackTrace();
System.out.println("发送失败");
return false;
}
System.out.println("发送完成");
return true;
}
/**
* 添加收件人
* @param list 存放收件人邮箱的集合
*/
private void setAccepter(ArrayList<String> list){
//创建收件人地址数组
InternetAddress[] sendTo = new InternetAddress[list.size()];
//把list中的数据转至数组
for (int i = 0; i < list.size(); i++) {
//System.out.println("发送到:" + list.get(i));
try {
sendTo[i] = new InternetAddress(list.get(i));
} catch (AddressException e) {
e.printStackTrace();
return;
}
}
//填入message对象
try {
message.setRecipients(MimeMessage.RecipientType.TO,sendTo);
} catch (MessagingException e) {
e.printStackTrace();
}
}
/**
* 设置附件和内容(当存在附件的情况下，必须通过此方法以发送内容，否则只显示附件而不显示内容)
* @param file 要添加到message对象的文件
* @param content 要添加到message对象的内容
*/
private void setMultipartAndContent(File file,String content) {
// 一个Multipart对象包含一个或多个BodyPart对象，来组成邮件的正文部分（包括附件）。
MimeMultipart multiPart = new MimeMultipart();
//内容模块
MimeBodyPart partText = new MimeBodyPart();
// 文件模块
MimeBodyPart partFile = new MimeBodyPart();
try {
//添加内容
partText.setContent(content,"text/html;charset=UTF-8");
//添加文件
partFile.attachFile(file);
// 设置在收件箱中和附件名 并进行编码以防止中文乱码
partFile.setFileName(MimeUtility.encodeText(file.getName()));
multiPart.addBodyPart(partText);
multiPart.addBodyPart(partFile);
message.setContent(multiPart);
} catch (IOException e) {
e.printStackTrace();
} catch (MessagingException e) {
e.printStackTrace();
}
}
/**
* 将通过表单上传的MultipartFile文件上传到服务器并转换为File
* @param file 通过表单上传的MultipartFile文件
* @return 返回上传到服务器并转换完成的文件
*/
private File getFile(MultipartFile file){
//得到MultipartFile文件
MultipartFile multipartFile = file;
File f = null;
//创建文件
System.out.println("上传文件:"+multipartFile.getOriginalFilename());
f = new File(multipartFile.getOriginalFilename());
//得到文件流。以文件流的方式输出到新文件
try (InputStream in = multipartFile.getInputStream(); OutputStream os = new FileOutputStream(f)){
// 可以使用byte[] ss = multipartFile.getBytes();代替while
int n;
byte[] buffer = new byte[4096];
while ((n = in.read(buffer,0,4096)) != -1){
os.write(buffer,0,n);
}
BufferedReader bufferedReader = new BufferedReader(new FileReader(f));
bufferedReader.close();
}catch (IOException e){
e.printStackTrace();
}
//输出file的URL
try {
System.out.println(f.toURI().toURL().toString());
} catch (MalformedURLException e) {
e.printStackTrace();
}
//输出文件的绝对路径
System.out.println(f.getAbsolutePath());
return new File(f.toURI());
}
/**
* 删除文件
* @param file 要删除的文件
* @return 根据方法执行情况返回一个Boolean类型的值
*/
private boolean deleteServerFile(File file){
return file.delete();
}
}