web-dev-qa-db-ja.com

メールの件名にアニメーションアイコン

私は知っているデータURIs base64 エンコードされたデータを画像などのインラインで使用できます。今日、私は実際に、件名にアニメーション（gif）アイコンが含まれるスパムメールを受信しました。

enter image description here

これはアイコンのみです。

enter image description here

だから、私の心を横切った唯一のことは、データURIについてであり、Gmailが何らかの絵文字を件名に挿入することを許可するかどうかでした。私はメールの完全な詳細版を見たが、下の写真の件名を指した：

enter image description here

したがって、GIFはData URIスキームに似た=?UTF-8?B?876Urg==?=エンコードされた文字列から取得されますが、アイコンを取得できませんでした。要素HTMLソースは次のとおりです。

enter image description here

要するに、https://mail.google.com/mail/e/XXXには多くの絵文字があります。XXXは16進数です。彼らはどこにも文書化されていないか、私はそれを見つけることができませんでした。それがデータURIである場合、Gmailの電子メールの件名にそれらをどのように含めることができますか？ （アイコンの代わりに[?]を見て、そのメールをyahooメールアカウントに転送しました）、そうでない場合、そのエンコードされた文字列はどのように解析されますか？

gmailbase64data-uri
102
revo

簡単な説明：

内部的にはgoomojiと呼ばれ、非標準のUTF-8拡張機能のようです。 Gmailでこれらの文字のいずれかが検出されると、対応するアイコンに置き換えられます。それらに関するドキュメントを見つけることはできませんでしたが、フォーマットをリバースエンジニアリングすることができました。


これらのアイコンは何ですか？

これらのアイコンは、実際には「絵文字を挿入」パネルの下に表示されるアイコンです。

Gmail Insert Emoticons

リストに 52E アイコンが表示されていませんが、同じ規則に従っている他のアイコンがいくつかあります。

gtalk.03C のように、名前に接頭辞が付いたアイコンもいくつかあることに注意してください gtalk.03C。これらのアイコンをこの方法で使用できるかどうか、またはどのように使用できるかを判断できませんでした。


このデータURIの内容は何ですか？

実際には Data URI ではありませんが、類似点はいくつかあります。実際には、電子メールの件名に非ASCII文字をエンコードするための特別な構文であり、 RFC 2047 で定義されています。基本的には、このように機能します。

=?charset?encoding?data?=

したがって、この例の文字列には、次のデータがあります。

=?UTF-8?B?876Urg==?=
  • charset = UTF-8
  • encoding = B（base64を意味する）
  • data = 876Urg==


それで、それはどのように機能しますか？

どういうわけか、876Urg==はアイコン52Eを意味することを知っていますが、どのように？

876Urg==をbase64でデコードすると、0xf3be94aeが得られます。これは、バイナリでは次のようになります。

11110011 10111110 10010100 10101110

これらのビットは、4バイトのUTF-8エンコード文字と一致しています。

11110xxx 10xxxxxx 10xxxxxx 10xxxxxx

したがって、関連するビットは次のとおりです。

     011   111110   010100   101110

または整列した場合：

00001111 11100101 00101110

16進数では、これらのバイトは次のとおりです。

FE52E

ご覧のとおり、おそらくFEアイコンを他のUTF-8文字と区別するためのgoomojiプレフィックスを除き、アイコンURLの52Eと一致します。いくつかのテストは、これが他のアイコンにも当てはまることを証明しています。


大変な作業のようですが、コンバーターはありますか？：

これはもちろんスクリプト化できます。テスト用に次のPythonコードを作成しました。これらの関数は、base64でエンコードされた文字列と、URLで見つかった短い16進数文字列との間で変換できます。このコードはPython 3向けに書かれており、Python 2互換ではありません。

変換関数：

import base64

def goomoji_decode(code):
    #Base64 decode.
    binary = base64.b64decode(code)
    #UTF-8 decode.
    decoded = binary.decode('utf8')
    #Get the UTF-8 value.
    value = ord(decoded)
    #Hex encode, trim the 'FE' prefix, and uppercase.
    return format(value, 'x')[2:].upper()

def goomoji_encode(code):
    #Add the 'FE' prefix and decode.
    value = int('FE' + code, 16)
    #Convert to UTF-8 character.
    encoded = chr(value)
    #Encode UTF-8 to binary.
    binary = bytearray(encoded, 'utf8')
    #Base64 encode return end return a UTF-8 string. 
    return base64.b64encode(binary).decode('utf-8')

例：

print(goomoji_decode('876Urg=='))
print(goomoji_encode('52E'))

出力：

52E
876Urg==

そしてもちろん、アイコンのURLを見つけるには、Gmailで新しい下書きを作成し、必要なアイコンを挿入し、ブラウザーのDOMインスペクターを使用するだけです。

DOM Inspector

172
Alexander O'Mara

正しい16進コードポイント（例： fe4f4 for 'pile of poo' ）を使用し、件名行ヘッダー内で正しくエンコードされている場合、base64（@AlexanderOMaraを参照）またはquoted-printableにします。 （=?utf-8?Q?=F3=BE=93=B4?=）、Gmailは自動的に解析し、対応する絵文字に置き換えます。

これは、件名行にコピーして貼り付けるためのGmail絵文字リストです -またはメール本文。受信トレイでさらに注目を集めるアニメーション絵文字は、黄色の背景に配置されます。

Gmail emojis on emailmarketingtipps.de

18
lukeA

Alexander O'Mara に感謝します。goomojiタグ付きHTML画像に関するこのようなよく研究された回答に感謝します。

私は3つのことを追加したかっただけです。

  • スパマーやその他のかつてのマーケティング担当者が電子メールの件名行で使用し始め、gmailがHTMLイメージに変換しない絵文字（および写真を生成する他のUnicodeシーケンス）がまだたくさんあります。一部のブラウザでは、これらは太字と色付きで表示されますが、これはアニメーションとほとんど同じくらい悪いです。ブラウザcouldもこれらをアニメートすることを選択しますが、そうするかどうかはわかりません。これらのUnicodeシーケンスはブラウザによってUnicodeテキストとして表示されるため、正確な外観（色の有無、アニメーションの有無など）は、ブラウザが使用しているテキストレンダリングシステムによって異なります。特定のUnicode絵文字の外観は、Unicodeコードポイントシーケンスでその近くに表示される nicodeバリエーションセレクターおよび絵文字修飾子 にも依存します。画像ベースの絵文字スパムとは異なり、これらのシーケンスは、ブラウザからUnicodeテキストとして他のアプリにコピーアンドペーストできます。

  • このStackOverflowの質問を読んでいる多くのマーケターがただノーと言うことを願っています。電子メールの件名にこれらのシーケンスを含めるのは恐ろしい考えであり、あなたやあなたのブランドをすぐに低迷のスパマーとして傷つけます。メールが受け取る「注意」の価値はありません。

  • もちろん、みんなの頭に浮かぶ最初の質問は、「これらのことをどうやって取り除くか」です。幸いなことに、このオープンソースのGreasemonkey/Tampermonkey/Violentmonkeyユーザースクリプトがあります。

Gmail Subject Line Emoji Roach Motel

このユーザースクリプトは、HTMLイメージ（ Alexander O'Mara の素晴らしい作業のおかげ）と純粋なUnicodeタイプの両方を排除します。

後者のタイプの場合、userscriptには、マーケティング担当者に悪用される可能性のあるUnicodeシーケンスをキャプチャするために設計された正規表現が含まれます。 ES6 Javascriptの正規表現は次のようになります（ユーザースクリプトは、驚くべき ES6 Regex Transpiler を使用して、広くサポートされているES6以前の正規表現に変換します）：

var re = /(\p{Emoji_Modifier_Base}\p{Emoji_Modifier}?|\p{Emoji_Presentation}|\p{Emoji}\uFE0F|[\u{2100}-\u{2BFF}\u{E000}-\u{F8FF}\u{1D000}-\u{1F5FF}\u{1F650}-\u{1FA6F}\u{F0000}-\u{FFFFF}\u{100000}-\u{10FFFF}])\s*/gu

// which includes the Unicode Emoji pattern from
//   https://github.com/tc39/proposal-regexp-unicode-property-escapes
// plus also these blocks frequently used for spammy emojis
// (see https://en.wikipedia.org/wiki/Unicode_block ):
//   U+2100..U+2BFF     Arrows, Dingbats, Box Drawing, ...
//   U+E000..U+F8FF     Private Use Area (gmail generates them for some emoji)
//   U+1D000..U+1F5FF   Musical Symbols, Playing Cards (sigh), Pictographs, ...
//   U+1F650..U+1FA6F   Ornamental Dingbats, Transport and Map symbols, ...
//   U+F0000..U+FFFFF   Supplementary Private Use Area-A
//   U+100000..U+10FFFF Supplementary Private Use Area-B
// plus any space AFTER the discovered emoji spam
0
Louis Semprini