1

信件內嵌圖檔與 Outlook 讀信自動下載外部圖檔行為

 1 year ago
source link: https://blog.darkthread.net/blog/external-image-download-in-outlook/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

信件內嵌圖檔與 Outlook 讀信自動下載外部圖檔行為-黑暗執行緒

HTML 格式已是當今 Email 格式主流,幾乎各家郵件軟體都支援,寫信時將重點文字改粗體,強調部分上顏色,再插幾張圖片做到圖文並茂,已是再平常不過的事。

若是由程式發信,程式庫一般也都支援 HTML 格式,但講到在在內文嵌入圖檔,則有些注意事項。以廣告行銷信為例,假設活動邀請信想附上會場地圖,從網頁開發者思維,將地圖的圖檔放在網站,信件內文加個 <img src="https://www.my-company.com/images/map.png" alt="會場地圖" /> 似乎就行了,比起每封信夾帶圖檔當附件,能省下可觀的傳輸流量。但老鳥都知道,這個想法實際運作會有點問題:基於安全考量,郵件軟體通常不自動下載外部圖片,使用者打開信件會先看到無法顯示的叉燒包圖示,需點擊相關提示才會下載圖檔正常顯示。

那我們平常用 Gmail、Outlook 寫信,信件內文可以內嵌圖片沒問題,收信者可以直接看到呀?那是透過內含附件(Inline Attachment)形式實現的。這裡來說說在 Email 內嵌圖檔的幾種方法,借用之前 EWS 收發信範例,我建立了一封 HTML 格式信件使用 EWS 送出,HTML 有包含圖檔,分別用 Inline Attachment + ContentId、Data URI 跟 src 指向外部網站三種做法:

static async Task<int> Main(string[] args)
{
    var ews = InitEws();

    var message = new EWS.EmailMessage(ews);
    message.Sender = new EWS.EmailAddress(Settings.Email);
    message.ToRecipients.Add(Settings.Recipient);
    message.Subject = $"內嵌及外部圖檔測試 - {DateTime.Now:HH:mm:ss}";
    var cid = Guid.NewGuid().ToString();
    var pngData = File.ReadAllBytes("icon180.png");
    var html =$@"
        <style>img {{margin:6px;}}</style>
        <dl>
            <dt>內嵌圖檔(ContentId)</dt>
            <dd><img src=""cid:{cid}"" /></dd>
            <dt>內嵌圖檔(Data URI)</dt>
            <dd><img src=""data:image/png;base64,{Convert.ToBase64String(pngData)}"" width=""180"" height=""180"" /></dd>
            <dt>外部圖檔</dt>
            <dd><img src=""https://blog.darkthread.net/img/icon180x180.png"" /></dd>
        </dl>";
    message.Body = new EWS.MessageBody(html) { BodyType = EWS.BodyType.HTML };
    message.Attachments.AddFileAttachment("icon180.png", pngData);
    message.Attachments[0].IsInline = true; //設為 Inline 附件
    message.Attachments[0].ContentId = cid; //指定 ContentId,對映 HTML 中的 cid:... URI
    await message.SendAndSaveCopy();
    return 0;
}

使用 Outlook 收信,Inline Attachment 跟 Data URI 有顯示,指向網站的外部圖檔呈現叉燒包,上方則有提示: 為了保護隱私,Outlook 不會自動下載郵件的某些圖片,要按一下才會下載:

Fig1_638140941431185917.png

這裡說的保護隱私是防止寄信者在 HTML 圖檔 URL 夾帶識別收信者身份的參數 (例如:https://web-server/some-img.png?recipient=jeffrey),若 Outlook 在預覽或讀取時未經同意即直接下載,對方便能掌握收信者何時讀信、所在 IP 位置等資訊,這些未必是使用者想提供的,故 Outlook 預設不自動下載圖片。

Outlook 的自動下載設定在 Outlook 選項 / 信任中心 / 信任中心設定:

Fig4_638140941433298912.png

預設所有選項都是勾選的,但其中第一二點要留意,來自特定寄件者的信件或放在信任區域站台的圖片會略過這層防護,直接下載。

Fig5_638140941435456823.png

安全寄件者可在下載提示按右鍵新增:

Fig6_638140941437600913.png

網際網路選項 / 安全性 / 信任的網站 / 網站 可將特定 URL 設成信任的站台:

Fig7_638140941442102712.png

由於以上設定可避開防護,設定時請務必確認寄信對象或網站範圍是安全的,若求謹慎,建議取消勾選,不管安全寄件者或信任網站,一律詢問後再下載。

【同場加映】順便試試 Gmail。

Fig2_638140941444286471.png

Inline Attachment 沒問題,但不支援 Data URI,另外 Gmail 也能做到預設不下載圖片,點選才放行,以及加入安全寄件者清單。

但我的信箱不知為何預設是「一律顯示不明外部圖片」,要修改的話設定位置如下:

Fig3_638140941446454243.png


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK