SpringBoot+Vue 批量发送邮件、工资条

2022-07-13 11:05:56 阅读：160 来源： 互联网

标签：工资条 false SpringBoot com 发送 Vue true response 邮件

1.邮箱配置，开启SMTP服务，获取授权码

2.springboot项目maven

 <!--邮箱-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-mail</artifactId>
            <version>${email.version}</version>
        </dependency>

3.配置application.yml

spring：下添加

#126邮箱SMTP服务器地址:smtp.126.com，端口号:465或者994
#163邮箱SMTP服务器地址:smtp.163.com，端口号:465或者994
#qq邮箱SMTP服务器地址:smtp.qq.com，端口号:465或587
#yeah邮箱SMTP服务器地址:smtp.yeah.net，端口号:465或者994
#邮件设置
mail:
  # 配置 SMTP 服务器地址
  host: smtp.qq.com
  # 发送者邮箱
  username: 1181055xxx@qq.com
  # 配置密码，注意不是真正的密码，而是刚刚申请到的授权码
  password: bzqieszypovyhjab
  #邮件标题，邮件发送方
  subject-from: xx财务
  # 端口号465或587
  port: 587
  # 默认的邮件编码为UTF-8
  default-encoding: UTF-8
  # 配置SSL 加密工厂
  properties:
    mail:
      smtp:
        socketFactoryClass: javax.net.ssl.SSLSocketFactory
        starttls:
          enable: true
          required: true
      ssl:
        enable: true
      # 表示开启 DEBUG 模式，这样，邮件发送过程的日志会在控制台打印出来，方便排查错误
      debug: false

4.测试发送方法

简单发送

  @GetMapping("/fa")
    public void sendSimpleEmail() {
        SimpleMailMessage message = new SimpleMailMessage();//创建简单邮件消息
        message.setFrom("1181055xxx@qq.com");//设置发送人
        message.setTo("160606xxx@qq.com");//设置收件人
        /* String[] adds = {"xxx@qq.com","yyy@qq.com"}; //同时发送给多人
        message.setTo(adds);*/
        message.setSubject("这是一封测试邮件");//设置主题
        message.setText("这是测试邮件的正文");//设置内容
        try {
            mailSender.send(message);//执行发送邮件
            log.info("简单邮件已经发送。");
        } catch (Exception e) {
            log.error("发送简单邮件时发生异常！", e);
        }
    }

HTML发送

 @GetMapping("/test")
    public void sendHtml() throws Exception {
        MimeMessage message = mailSender.createMimeMessage();
        MimeMessageHelper helper = new MimeMessageHelper(message, true);
        //这里可以自定义发信名称比如：工资条
        helper.setFrom("1181055xxx@qq.com","工资条");
        helper.setTo("160606xxx@qq.com");
        helper.setSubject("这是一封测试邮件");
        helper.setText(
                "<html>\n" +
                        "<style>\n" +
                        "    .td{width:150px;height:70px}\n" +
                        "</style>\n" +
                        "<body>\n" +
                        "<table border=\"1\">\n" +
                        "    <tr>\n" +
                        "        <td style=\"text-align:center\" class=\"td\">序号</td>\n" +
                        "        <td style=\"text-align:center\" class=\"td\">姓名</td>\n" +
                        "        <td style=\"text-align:center\" class=\"td\">员工类别</td>\n" +
                        "    </tr>\n" +
                        "    <tr>\n" +
                        "        <td style=\"text-align:center\" class=\"td\">1</td>\n" +
                        "        <td style=\"text-align:center\" class=\"td\">2</td>\n" +
                        "        <td style=\"text-align:center\" class=\"td\">3</td>\n" +
                        "    </tr>\n" +
                        "</table>\n" +
                        "</body>\n" +
                        "</html>\n",true);
        mailSender.send(message);
    }

Thymeleaf发送

resources下创建tempales文件、创建email.html

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>exchange</title>
</head>
<style>
    body {
        cursor: default;
    }
    .exchangeCode {
        color: #72cdff;
    }
</style>
<body>
<div>
    <label>ExchangeCode：</label>
    <div class="exchangeCode" th:text="${GoldCoinCode}"></div>
</div>
</body>
</html>

@GetMapping("/thyme")
    public void testSendHtmlMailThymeLeaf() throws MessagingException {
        MimeMessage mimeMessage = mailSender.createMimeMessage();
        MimeMessageHelper helper = new MimeMessageHelper(mimeMessage, true);
        helper.setSubject("测试发送Thymeleaf模板Email");
        helper.setFrom("1181055xxx@qq.com");
        helper.setTo("160606xxx@qq.com");
        Context context = new Context();
        context.setVariable("GoldCoinCode", "goldCoinCode");
        String process = templateEngine.process("emil.html", context);
        helper.setText(process,true);
        mailSender.send(mimeMessage);
    }

5.Controller层

 /**
     * 批量发送模板
     *
     * @return 模板
     */
    @GetMapping("/outputTemplate")
    public AjaxResult importTemplate() {
        ExcelUtil<EmailSalarySheetRequest> util = new ExcelUtil<>(EmailSalarySheetRequest.class);
        return util.importTemplateExcel("邮件导出模板");
    }

    /**
     * excel 批量发邮件
     *
     * @param file excel
     * @return TableDataInfo
     * @throws Exception Exception
     */
    @Log(title = "批量发送邮件", businessType = BusinessType.IMPORT)
    @PreAuthorize("@ss.hasPermi('admin:send:email:batch')")
    @PostMapping("/inputTemplate")
    public AjaxResult importExpress(MultipartFile file) throws Exception {
        ExcelUtil<EmailSalarySheetRequest> excelUtil = new ExcelUtil<>(EmailSalarySheetRequest.class);
        List<EmailSalarySheetRequest> importExcel = excelUtil.importExcel(file.getInputStream());
        if (file.getOriginalFilename() == null) {
            return AjaxResult.success("excel-文件名不能为空");
        }
        if (file.getOriginalFilename().contains("邮件")) {
            return AjaxResult.success(emailService.sendEmailExcel(importExcel));
        } else {
            return AjaxResult.success("excel-文件选择不对");
        }
    }

6.业务层

Excel 表上传转为发送邮件list对象，发送业务层处理发送邮件

VUE

index.vue

<template>
  <div class="app-container">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="success"
          icon="el-icon-download"
          size="mini"
          v-hasPermi="['admin:send:email:batch']"
          @click="handleImport"
        >批量发送邮件
        </el-button>
      </el-col>
    </el-row>
    <!-- 批量发送导入对话框 -->
    <el-dialog title="上传Excel" :visible.sync="batchOpen" width="400px" append-to-body>
      <el-upload
        ref="upload"
        :limit="1"
        accept=".xlsx, .xls"
        :headers="upload.headers"
        :action="upload.url"
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :auto-upload="false"
        drag
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">
          将文件拖到此处，或
          <em>点击上传</em>
        </div>
        <div class="el-upload__tip" slot="tip">
          <el-link type="info" style="font-size:12px" @click="outputTemplate">下载模板</el-link>
        </div>
        <div class="el-upload__tip" style="color:red" slot="tip">提示：仅允许导入“xls”或“xlsx”格式文件！并文件名包含邮件二字</div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" :disabled="flag" @click="submitFormExport">确 定</el-button>
        <el-button @click="cancel2">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {getToken} from "@/utils/auth";
  import {emailOutputTemplate} from "@/api/admin/email/sendEmail";

  export default {
    name: "SendEmail",
    components: {},
    data() {
      return {
        //设置按钮可选
        flag: false,
        // 遮罩层
        loading: true,
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        batchOpen: false,
        rules: {},
        // 用户导入参数
        upload: {
          // 是否显示弹出层（用户导入）
          batchOpen: false,
          // 弹出层标题（用户导入）
          title: "",
          // 是否禁用上传
          isUploading: false,
          // 设置上传的请求头部
          headers: {Authorization: "Bearer " + getToken()},
          // 上传的地址
          url: process.env.VUE_APP_BASE_API + "/admin/email/inputTemplate"
        },
      };
    },
    created() {
      this.getList();
      this.getDicts("zhongmubao_yes_or_no").then(response => {
        this.isDeletedOptions = response.data;
      });
    },
    methods: {
      getList() {
        this.loading = true;
        // listCustomerBallLibraryOperationRecord(this.queryParams).then(response => {
        //   this.customerBallLibraryOperationRecordList = response.rows;
        //   this.total = response.total;
        //   this.loading = false;
        // });
      },
      // 是否删除字典翻译
      isDeletedFormat(row, column) {
        return this.selectDictLabel(this.isDeletedOptions, row.isDeleted);
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 取消按钮
      cancel2() {
        this.batchOpen = false;
      },
      /** 提交按钮 */
      submitFormExport: function (response) {
        this.exportFlag = true;
        this.$refs.upload.submit();
      },
      /** 导出按钮操作 */
      handleExport() {
        const queryParams = this.queryParams;
        this.$confirm('是否确认导出所有批量发送肉丸肉串数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function () {
          return exportCustomerBallLibraryOperationRecord(queryParams);
        }).then(response => {
          this.download(response.msg);
        })
      },
      /** 上传按钮操作 */
      handleImport() {
        this.batchOpen = true;
      },
      outputTemplate() {
        emailOutputTemplate().then(response => {
          this.download(response.msg);
        });
      },
      // 文件上传中处理
      handleFileUploadProgress(event, file, fileList) {
        this.upload.isUploading = true;
      },
      // 文件上传成功处理
      handleFileSuccess(response, file, fileList) {
        this.upload.batchOpen = false;
        this.upload.isUploading = false;
        this.$refs.upload.clearFiles();
        this.$alert(response.msg+":发送"+response.data+"封邮件", "邮件发送结果", {dangerouslyUseHTMLString: true});
        if (response.msg.indexOf(".xlsx") !== -1) {
          this.download(response.msg);
        }
        if (response.data === true) {
          this.flag = false;
        }
      },
    }
  };
</script>

标签：工资条,false,SpringBoot,com,发送,Vue,true,response,邮件
来源： https://www.cnblogs.com/Runawayprogrammer/p/16473061.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

SpringBoot+Vue 批量发送邮件、工资条