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

2022-03-27 00:00:00 keycloak html java

我正在尝试在重置密码电子邮件中显示公司徽标。我已经检查了钥匙斗篷文档，发现它们不支持它。我也尝试过将图像编码为base64格式，但Gmail不支持。我如何才能做到这一点？

解决方案

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

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

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

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

就像链接上说的那样.要部署它，请执行以下操作：

复制
部署主题的最简单方法是复制 SRC/Main/Resources/Theme/*转到Themes/。

模块

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

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

在签出项目和源代码之前，请注意选择相同的密钥罩版本。

将徽标添加到现有自定义主题内的电子邮件模板的步骤

找到您的模板文件：/html/password-set.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-set.ftl]
在Keycloak中打包并部署主题
在领域配置选项卡中选择您的电子邮件模板

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

更新：

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

正如它所说，许多Web客户端不会显示包含一个以上Base64 Embedded图像的电子邮件(或者一个都不显示)。

因此，使用钥匙罩电子邮件的一个好策略是使用对静电内容服务器提供的图像的引用(如果没有，钥匙罩位于也可以配置为静电服务器的野苍蝇上)。

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

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

相关文章