Keycloak 将公司徽标添加到重置密码电子邮件答案

【问题标题】：Keycloak add company logo to the reset password emailKeycloak 将公司徽标添加到重置密码电子邮件
【发布时间】：2020-01-01 16:39:09
【问题描述】：

我正在尝试在重置密码电子邮件中显示公司徽标。我已经检查了 keycloak 文档，发现他们不支持它。我还尝试将图像编码为 base64，但 Gmail 不支持。我该怎么做？

【问题讨论】：

您是否创建了自定义电子邮件主题并覆盖了password-reset.ftl？
是的，我做到了。我尝试将图像添加到主题/电子邮件/资源/img 并通过在 img 标签中调用 ${url.resourcePath}/img/myImage.jpg 来引用它，但仍然不起作用

标签： java html keycloak

【解决方案1】：

您需要创建一个自定义主题。查看 Keycloak 的文档第 3 章：docs

有五种类型的主题/页面：

帐户 - 帐户管理
管理员 - 管理控制台
电子邮件 - 电子邮件
登录 - 登录表单
欢迎 - 欢迎页面

您可以先签出此示例存储库kc themes sample，编辑模板并将其部署到您的密钥斗篷中。

就像链接说的那样......部署它：

复制

部署主题的最简单方法是复制 src/main/resources/theme/* 到主题/。

模块

或者，您可以部署为模块。这可以通过首次运行：

mvn clean install $KEYCLOAK_HOME/bin/jboss-cli.sh --command="module add --name=org.keycloak.example.themes --resources=target/keycloak-example-themes.jar"

然后打开standalone/configuration/standalone.xml 并通过添加注册主题模块：
<theme>
    ...
    <modules>
        <module>org.keycloak.example.themes</module>
    </modules>
</theme>

您可以复制其他主题或将其从 base templates 复制到您的自定义主题项目中。

电子邮件基本模板：email templates

在签出项目和来源之前，请注意选择相同的 Keycloak 版本。

在现有自定义主题中向电子邮件模板添加徽标的步骤

找到您的模板文件：/html/password-reset.ftl（例如base sample file）

    <html>
    <body>
    ${kcSanitize(msg("passwordResetBodyHtml",link, linkExpiration, realmName, linkExpirationFormatter(linkExpiration)))?no_esc}
    </body>
    </html>

替换为您的代码。例如。使用 base64 图像或对图像文件的链接引用（https://static.myserver.com/image.png 等...）

    <html>
    <body>
        <div>
            <img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA
    AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
        9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red Logo">
        </div>
        <div>
        ${kcSanitize(msg("passwordResetBodyHtml",link, linkExpiration, realmName, linkExpirationFormatter(linkExpiration)))?no_esc}
        </div>
    </body>
    </html>

也更新您的纯文本模板（如果您需要，因为并非所有客户端都支持 html）。您不能在此处添加图片，但如果有短信 [file text/password-reset.ftl]
在 Keycloak 中打包和部署您的主题
在“领域配置”选项卡中选择您的电子邮件模板

正如您在DefaultEmailSenderProvider.java 类中看到的那样，Keycloak 将尝试发送 HTML 电子邮件，如果您未定义它，则使用纯文本（文件：text/password-reset.ftl

更新：

目前有一些电子邮件客户端施加了一些限制。我建议您阅读以下有关它的说明 (read me)。

正如它所说，许多网络客户端不会显示包含多个嵌入 base64 图像的电子邮件（或一个都不包含）。

因此，使用 Keycloak 电子邮件的一个好策略是使用对从静态内容服务器提供的图像的引用（如果您没有其中一个，keycloak 是通过也可以配置为静态服务器的野蝇)。

因此，您可以实施的最佳解决方案是按如下方式添加您的图片：例如。

<img src = "https://static.myserver.com/static/logo.png" alt = "img" />

【讨论】：

感谢您的回复，但我已经在 keycloak 中提供了所有自定义主题。问题只是在与密码重置相关的电子邮件中添加徽标
您需要修改您的 html/password-reset.ftl 并在 html 代码中添加您的徽标...我会尽力完成答案。
嗨@javamat，你能最后添加图像吗？你能解决它还是迷路了？
嗨，我决定通过将 URL 传递给托管徽标的服务来添加图像
很遗憾，Gmail 不支持 base64 编码

【解决方案2】：

DefaultEmailSenderProvider 类仅允许将文本和 html 内容作为multipart/alternative。这还不足以让（在大多数邮件客户端中）嵌入图像（如徽标等）运行良好。

html 部分应通过multipart/related 部分与图像一起包装。因此，似乎需要一些自定义的EmailSenderProvider。它应该为可以嵌入到 html 部分的内联图像公开另一个参数。结果应该是类似于下面的结构。

- alternative
-- text
-- related
--- html
--- inline image 
--- inline image

由于我花了一些时间进行研究，但尚未带来任何结果，因此我计划向 keycloak 贡献者提出请求。

Here 很好地说明了它如何与有趣的 Apache 项目的链接一起工作。

【讨论】：