发送HTML模板邮件

概述

为了增强邮件内容展示的样式,可以将普通的文本邮件转换为HTML内容格式。
在Java中,可以通过页面模板技术来实现。具体来说,可以使用Thymeleaf模板。

具体实现

首先,在项目中引入Thymeleaf依赖:

<dependency>
    <groupId>org.thymeleaf</groupId>
    <artifactId>thymeleaf</artifactId>
    <version>3.0.15.RELEASE</version>
</dependency>

其次,编写页面模板内容:

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>TOP100车系车友圈精华帖双周增量监控</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <style type="text/css">
        .znwh_tb {
            border: 1px solid rgba(87, 84, 84, 0.99);
            border-collapse:collapse;
        }
        .znwh_tb th,
        .znwh_tb td {
            border: 1px solid #545454;
            padding: 3px 5px;
        }
        .znwh_tb th {
            background-color:#DCDCDC;
        }
    </style>
</head>
<body style="margin: 0; padding: 0;">
<h3>精华帖统计</h3>
<p>时间:<span th:text="${startDate}"></span>-<span th:text="${endDate}"></span>,新增帖子数:<span th:text="${bbsIncrement}"></span></p>

<h3>按阅读数倒序TOP<span th:text="${topSize}"></span>精华帖列表</h3>
       <table class="znwh_tb">
    <tr>
        <th>序号</th><th>发帖时间</th><th>加精日期</th><th>阅读数</th><th>评论数</th><th>点赞数</th><th>分享数</th><th>车系</th><th>标题</th>
    </tr>
    <tr th:each="bbs,bbsStat:${bbsList}">
        <td th:text="${bbsStat.index+1}"></td>
        <td th:text="${#dates.format(bbs.publishTimeDate, 'yyyy-MM-dd HH:mm:ss')}"></td>
        <td th:text="${#dates.format(bbs.createdStimeDate, 'yyyy-MM-dd HH:mm:ss')}"></td>
        <td th:text="${bbs.viewCount}"></td>
        <td th:text="${bbs.commentCount}"></td>
        <td th:text="${bbs.likeCount}"></td>
        <td th:text="${bbs.shareCount}"></td>
        <td th:text="${bbs.seriesName}"></td>
        <td><a th:href="@{${bbs.originUrl}}" rel="noopener noreferrer"><span th:text="${bbs.title}"></span></a></td>
    </tr>
</table>
<p><b>注:</b>完整数据详见附件文档。</p>
</body>
</html>

最后,加载页面模板渲染最终结果。

private static void buildTop100SeriesBbsMail(List<CyqBbs> bbsList) throws IOException {
	//构造模板引擎
	ClassLoaderTemplateResolver resolver = new ClassLoaderTemplateResolver();
	resolver.setPrefix("templates/");//模板所在目录,相对于当前classloader的classpath。
	resolver.setSuffix(".html");//模板文件后缀
	TemplateEngine templateEngine = new TemplateEngine();
	templateEngine.setTemplateResolver(resolver);

	//构造上下文(Model)
	Context context = new Context();
	context.setVariable("startDate", "10.21");
	context.setVariable("endDate", "11.10");
	context.setVariable("bbsIncrement", "100");
	context.setVariable("topSize", "50");
	context.setVariable("bbsList", bbsList);

	//渲染模板
	String fileName = "dcd_result.html";
	FileWriter write = new FileWriter(fileName);
	templateEngine.process("dcd_top100series_bbs_monitor_mail", context, write);
	write.close();
}

public static void main(String[] args) throws IOException {
	CyqBbs bbs = CyqBbs.builder()
				.id(10)
				.publishTimeDate(Calendar.getInstance().getTime())
				.createdStime(LocalDateTime.now())
				.behotTime(System.currentTimeMillis())
				.seriesName("艾薇塔11")
				.viewCount(100)
				.commentCount(1000)
				.likeCount(10)
				.shareCount(2)
				.originUrl("http://www.baidu.com")
				.title("测试数据")
				.build();
	ZoneId zoneId = ZoneId.systemDefault();
	ZonedDateTime zdt = bbs.getCreatedStime().atZone(zoneId);
	Date createdTimeDate = Date.from(zdt.toInstant());
	bbs.setCreatedStimeDate(createdTimeDate);
	List<CyqBbs> bbsList = Collections.singletonList(bbs);
	buildTop100SeriesBbsMail(bbsList);
}

最终输出的结果如下:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>TOP100车系车友圈精华帖双周增量监控</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <style type="text/css">
            .znwh_tb { 
                border: 1px solid rgba(87, 84, 84, 0.99); 
                border-collapse:collapse; 
            } 
            .znwh_tb th,
            .znwh_tb td {
                border: 1px solid #545454; 
                padding: 3px 5px; 
            }
            .znwh_tb th {
                background-color:#DCDCDC;
            }
        </style>
    </head>
    <body style="margin: 0; padding: 0;">
        <h3>精华帖统计</h3>
        <p>时间:<span>10.21</span>-<span>11.10</span>,新增帖子数:<span>100</span></p>
        
        <h3>按阅读数倒序TOP<span>50</span>精华帖列表</h3>
       <table class="znwh_tb">
            <tr>
                <th>序号</th><th>发帖时间</th><th>加精日期</th><th>阅读数</th><th>评论数</th><th>点赞数</th><th>分享数</th><th>车系</th><th>标题</th>
            </tr>
            <tr>
                <td>1</td>
                <td>2022-12-21 18:34:25</td>
                <td>2022-12-21 18:34:26</td>
                <td>100</td>
                <td>1000</td>
                <td>10</td>
                <td>2</td>
                <td>艾薇塔11</td>
                <td><a href="http://www.baidu.com" rel="noopener noreferrer"><span>测试数据</span></a></td>
            </tr>
        </table>
        <p><b>注:</b>完整数据详见附件文档。</p>
    </body>
</html>

这里要注意: 不同的邮件客户端对于css样式的兼容效果不同,所以最好对常见的邮件客户端展示结果做一下充分的测试。

相比起使用页面模板技术实现的HTML邮件,直接手动输出HTML内容的方式就显得非常笨拙,且不容易维护。
如下是手动输出HTML字符串的实现方式参考:

private static String buildTop100SeriesBbsHtmlStr(List<CyqBbs> bbsList) {
	StringBuilder builder = new StringBuilder();
	builder.append("<html>");
	builder.append("<head>");
	builder.append("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\" />");
	builder.append("<title>TOP100车系车友圈精华帖双周增量监控</title>");
	builder.append("<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"/>");
	builder.append("<style type=\"text/css\">");
	builder.append(".znwh_tb { border: 1px solid rgba(87, 84, 84, 0.99);border-collapse:collapse; }");
	builder.append(".znwh_tb th,.znwh_tb td {border: 1px solid #545454; padding: 3px 5px; }");
	builder.append(".znwh_tb th { background-color:#DCDCDC; }");
	builder.append("</style>");
	builder.append("</head>");
	builder.append("<body style=\"margin: 0; padding: 0;\">");
	builder.append("<h3>精华帖统计</h3>");
	builder.append("<p>时间:").append("10.21").append("-").append("11.10").append(",新增帖子数:").append(100).append("</p>");
	builder.append("<h3>按阅读数倒序TOP").append(50).append("精华帖列表</h3>");
	builder.append("<table class=\"znwh_tb\">");
	builder.append("<tr><th>序号</th><th>发帖时间</th><th>加精日期</th><th>阅读数</th><th>评论数</th><th>点赞数</th><th>分享数</th><th>车系</th><th>标题</th></tr>");
	for (int i = 0; i < bbsList.size(); i++) {
	CyqBbs bbs = bbsList.get(i);
	builder.append("<tr>");
	builder.append("<td>").append(i).append("</td>");
	builder.append("<td>").append(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(bbs.getPublishTimeDate())).append("</td>");
	builder.append("<td>").append(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date(bbs.getBehotTime()))).append("</td>");
	builder.append("<td>").append(bbs.getViewCount()).append("</td>");
	builder.append("<td>").append(bbs.getCommentCount()).append("</td>");
	builder.append("<td>").append(bbs.getLikeCount()).append("</td>");
	builder.append("<td>").append(bbs.getShareCount()).append("</td>");
	builder.append("<td>").append(bbs.getSeriesName()).append("</td>");
	builder.append("<td>").append("<a href=\"").append(bbs.getOriginUrl()).append("\" rel=\"noopener noreferrer\">").append(bbs.getTitle()).append("</a>").append("</td>");
	builder.append("</tr>");
	}
	builder.append("</table>");
	builder.append("<p><b>注:</b>完整数据详见附件文档。</p>");
	builder.append("</body>");
	builder.append("</html>");
	return builder.toString();
}

它们使用到的共同实体类定义如下:

@Data
@Builder
static class CyqBbs {
	private Integer id;
	private String title;
	private String content;
	private String originUrl;
	private String authorName;
	private String cover;
	private String keywords;
	private String tags;
	private String seriesId;
	private String seriesName;
	private Integer commentCount;
	private Integer likeCount;
	private Integer viewCount;
	private Integer playCount;
	private Integer shareCount;
	private Integer duration;
	private Long publishTime;
	private Date publishTimeDate;
	private Long behotTime;
	private LocalDateTime createdStime;
	private Date createdStimeDate;
	private LocalDateTime modifiedStime;
}
posted @ 2022-12-25 21:48  nuccch  阅读(313)  评论(0编辑  收藏  举报