Next.js：如何正确将图像 URL 设置为 HTML，以便图像显示在电子邮件模板中

Question

我正在 nextjs 中制作电子邮件模板。我目前正在尝试这种方法将徽标添加到电子邮件模板中：

 const emailHTML = verifyEmailTemplate
      .replace('{{ subject }}', subject)
      .replace('{{ code }}', code)
      .replace('{{ logoURL }}', 'https://fakeURL.com/images/logo/logo-dark.png');

...

const verifyEmailHTML = `
<table role="presentation" class="main">
    <!-- START MAIN CONTENT AREA -->
    <tr>
    <td class="wrapper">
        <table
        role="presentation"
        border="0"
        cellpadding="0"
        cellspacing="0"
        >
        <tr>
            <img
            class="logo"
            src="{{ logoURL }}"
            alt="Logo"
            />
        </tr>
...

但它没有加载电子邮件中的图像。这让我想到了几个问题。这是向电子邮件模板添加图像的最佳方法吗？我应该先嵌入图像还是没关系？更好的方法是从我的 nexjs 项目中的公共目录访问图像吗？我这样做完全是错误的吗？谢谢！

我已经尝试过上述方法，尝试从也有图像的公共目录访问图像，并尝试将图像 URL 直接放入 html 中。

Answer 1

检查电子邮件客户端是否默认阻止图像以及是否需要手动启用它们。