阅读电子邮件的 html 模板未按预期显示

Posted 2023-02-23

【中文标题】阅读电子邮件的 html 模板未按预期显示

【英文标题】：reading html template for email is not shown as expected

【发布时间】：2022-01-23 08:54:03

【问题描述】：

使用以下代码发送电子邮件时，结果与预期不符。缺少图像，并且模板未按应有的方式居中。我提供存在的内容与预期的内容。我不确定问题出在html 还是模板的阅读上。

python 代码：

    import smtplib, ssl
    from email.mime.text import MIMEText
    from email.mime.multipart import MIMEMultipart 
    
    class Mail:
    
        def __init__(self):
            self.sender_mail = '[e-mail]'
            self.password = 'my_pw'
            self.smtp_server_domain_name = "smtp.gmail.com"
            self.port = 465
    
        def send(self, emails):
            ssl_context = ssl.create_default_context()
            service = smtplib.SMTP_SSL(self.smtp_server_domain_name, self.port, context=ssl_context)
            service.login(self.sender_mail, self.password)
            
            for email in emails:
                mail = MIMEMultipart('mixed')
                mail['Subject'] = 'Celebrations'
                mail['From'] = self.sender_mail
                mail['To'] = email
     
                html_file = open('./templates/index.html')
                html_content = MIMEText(html_file.read(), 'html') 
                mail.attach(html_content) 
                service.sendmail(self.sender_mail, email, mail.as_string())
    
            service.quit()
        
    
    if __name__=='__main__':
         
        mail = Mail()
        mail.send(emails=['[e-mail]'])

index.html on github

展望结果：

预期结果（这是浏览器上的 index.html）：

【问题讨论】：

问题可能是 HTML。如果 Outlook 接收到它，那么您的一半代码正在运行。对于渲染，请尝试内联样式。

【参考方案1】：

我假设您使用的是 Outlook 应用程序，而不是基于 Web 的版本。

我尝试从 Outlook 和 Gmail 的网络版本查看电子邮件，唯一的问题是图像无法加载，并且任何锚标签都失去了样式。

经过一番挖掘，我找到了this，它允许您将图像作为附件发送并在 html 中使用。

我修改了python代码来附上图片：

import smtplib, ssl
from email.mime.text import MIMEText
from email.mime.multipart import MIMEMultipart 
from email.mime.image import MIMEImage

class Mail:

    def __init__(self):
        self.sender_mail = '[e-mail]'
        self.password = 'password'
        self.smtp_server_domain_name = "smtp.gmail.com"
        self.port = 465

    def send(self, emails):
        ssl_context = ssl.create_default_context()
        service = smtplib.SMTP_SSL(self.smtp_server_domain_name, self.port, context=ssl_context)
        service.login(self.sender_mail, self.password)

        for email in emails:
            mail = MIMEMultipart('mixed')
            mail['Subject'] = 'Celebrations'
            mail['From'] = self.sender_mail
            mail['To'] = email

            with open('./templates/index.html') as html_file:
                html_content = MIMEText(html_file.read(), 'html') 
                mail.attach(html_content) 

            with open('images/email.png', 'rb') as img:
                msgImage = MIMEImage(img.read())
                msgImage.add_header('Content-ID', '<images/email.png>')
                mail.attach(msgImage)

            service.sendmail(self.sender_mail, email, mail.as_string())

        service.quit()


if __name__=='__main__':
    mail = Mail()
    mail.send(emails=['[e-mail]'])

我还稍微修改了html：

<img src="cid:images/email.png" ... >

这允许图像在 Gmail 和 Outlook 的网站版本中呈现。

试试上面的方法，看看能不能至少加载图片。

我相信不同的电子邮件客户端在显示 HTML 时会有自己的怪癖。例如，Gmail 显然会在链接没有任何内联样式时重新格式化它们。我会研究 Outlook 在呈现 HTML 时会发生什么奇怪的事情。

【讨论】：

感谢您的帖子。最终结果是一样的（不居中且字体与html页面不一样）。