Velocity邮件模板中Base64图片无法显示的问题求助

嘿，我之前做邮件模板时也踩过一模一样的坑，咱们一步步拆解解决你的问题：

先搞定最致命的小细节：多余空格 #

你代码里的data:image/jpg;base64, $src在逗号后面多了个空格，很多邮件客户端（比如Outlook、部分Web邮箱）对这个空格极度敏感，直接会导致Base64解析失败。先把空格去掉，改成：

<img src="data:image/jpg;base64,$src">

验证Base64字符串本身是否有效 #

你能在页面上看到$src的内容，说明Velocity能正确获取到值，但得确认这个Base64本身是可用的：

• 把页面显示的Base64内容复制出来，本地用简单的解码工具（比如自己写几行Java代码解码）试试能不能生成正常图片。如果不行，说明后端生成Base64时就出问题了——比如没正确读取图片字节，或者用了带换行的Base64编码模式。

清理Base64里的换行符 #

如果后端用Java的Base64.encodeToString生成字符串，默认可能会插入换行符（比如Base64.DEFAULT模式），这些换行在邮件里会直接破坏Base64的结构。你可以在Velocity里提前替换掉：

#set ($imageBase64 = $ele.getImageBase64().replaceAll("\r|\n", ""))
<img src="data:image/jpg;base64,$imageBase64">

确保MIME类型完全匹配 #

注意标准的图片MIME类型：JPEG是image/jpeg（不是image/jpg，虽然部分客户端兼容，但尽量用标准写法），PNG是image/png。如果你的图片是PNG格式却写了image/jpg，也会导致加载失败。

优化Velocity表达式写法 #

直接在src里写$ele.getImageBase64()有时候会因为Velocity的解析优先级出问题，建议先把值赋值到变量里再用，同时加个非空判断避免空值异常：

#foreach( $ele in $list)
<tr>
    <td>$ele.getName()</td>
    <td>
        #set ($imageBase64 = $ele.getImageBase64())
        #if($imageBase64 && $imageBase64 != '')
            #set ($cleanBase64 = $imageBase64.replaceAll("\r|\n", ""))
            <img src="data:image/jpeg;base64,$cleanBase64" alt="$ele.getName()的图片">
        #else
            <span>无可用图片</span>
        #end
    </td>
    <td>$imageBase64</td>
</tr>
#end

按这个顺序排查下来，基本能解决大部分Base64图片加载失败的问题~

内容的提问来源于stack exchange，提问作者user2423768