4

我正在编写一个在线预订系统，它发送一个二维码作为确认电子邮件/电子票的一部分。

该电子邮件采用 HTML 格式，并且由于许多人在其电子邮件客户端中关闭图像，我正在研究使用<pre>标签在消息正文中显示 QR 码。

这样，无论电子邮件客户端设置是否显示图像，二维码都会显示。

这是我到目前为止所拥有的：

<pre style="font-family: 'Lucida Console', Monaco, monospace; font-size: 8px; font-weight: 900; padding: 0; letter-spacing: 0; line-height: 8px; ">



     ███████  █  █ ███████     
     █     █ █  █  █     █     
     █ ███ █  █    █ ███ █     
     █ ███ █ █  █  █ ███ █     
     █ ███ █   ███ █ ███ █     
     █     █ ███ █ █     █     
     ███████ █ █ █ ███████     
               ███             
     █████ ████  ██ █ █ █      
     █ █ █   ██  █  █  █       
     █ █  ███████ █  █ █
     ██  █   ██     ██ ███     
      ███  █    █ █  █ ██      
             █  ████  █        
     ███████ █ █ █ ██    █     
     █     █   █████  █        
     █ ███ █ ██  █  █  █       
     █ ███ █ ██  █  █  █       
     █ ███ █ ██ █ █  ███       
     █     █ ███    ██ ██      
     ███████ ████ █  ███       



</pre>

这在 Outlook 中看起来还不错，但在 gmail 中看起来很糟糕：

电子邮件阅读器中的预标记

我有几个问题，我希望有人能指出我正确的方向：

  1. 有没有办法让 gmail 观察行高？
  2. 有没有更好的字体可以使用？我正在使用“Lucida Console”，它给了我一个 8px x 6px 的矩形，但理想情况下我想要一个正方形的等宽字体。
4

2 回答 2

3

最后我放弃了尝试将二维码表示为 HTML。有太多问题无法克服，包括 chrome 不喜欢在表格中打印背景颜色，因此无法打印 qrcode。

但是，我确实设法将图像嵌入到电子邮件中，因此它显示在 Outlook 和 gmail 中，而用户无需下载图像。

如果其他人试图将 QR 码（或其他图像）嵌入到电子邮件中以便它们立即显示，我会将我的解决方案放在这里。

重要的是使用链接资源并在 HTML 中正确引用它：

...
<p><img src=""cid:{0}"" alt=""booking barcode"" /><br></p>
...

我使用了以下参考资料：

using System.Drawing.Imaging;
using System.IO;
using System.Linq;
using System.Net.Mail;
using System.Net.Mime;

创建我的电子邮件时：

public class BookingConfirmation : MailMessage
{
    public BookingConfirmation( ... )
    {
        To.Add( ... );
        Subject = "...";

        // create some html for the email
        var html = String.Format(
        @"<!DOCTYPE HTML PUBLIC ""-//W3C//DTD XHTML 1.0 Strict//EN"" 
        ""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\"">
        <html xmlns=""http://www.w3.org/1999/xhtml\"">
        <head>
        <meta http-equiv=""Content-Type"" content=""text/html; charset=utf-8"" />
        <meta name=""viewport"" content=""width=device-width, initial-scale=1.0"" />
        <title>My Title</title>
        </head>
        <body style=""font-family: Arial, sans-serif; font-size: 12px;"">
        <p><img src=""cid:{0}"" alt=""booking barcode"" /><br></p>
        </body>
        </html>","myuniqueid1234" );

        // create an html view
        var htmlView = AlternateView.CreateAlternateViewFromString(html, 
                                                                   Encoding.UTF8, 
                                                                   MediaTypeNames.Text.Html);

        // get an image as a memory stream
        var memoryStream = new MemoryStream();
        var qrCodeImage =  ... however you want to access your image ...;
        qrCodeImage .Save(memoryStream, ImageFormat.Jpeg);
        memoryStream.Position = 0;

        // add it as a linked resource to the alternate view
        var linkedImage = new LinkedResource(memoryStream, MediaTypeNames.Image.Jpeg)
        {
            ContentId = "myuniqueid1234" // this needs to match for <img src=""cid:{0}""
        }; 

        // add the linked resource to the html format alternate view
        htmlView.LinkedResources.Add(linkedImage) ;
        AlternateViews.Add(htmlView);
    }
}
于 2013-11-12T01:17:51.153 回答
2

这是一个相当不错的主意！

您的问题主要是邮件程序的问题。你应该看看这个答案，这个问题与你的有关。您可能必须使用表格单元格（黑色背景？）。

于 2013-10-30T09:26:09.657 回答