Анимированная иконка в теме электронной почты

Я знаю, о данные URI, в котором base64 закодированные данные можно использовать inline как изображения. Сегодня я получил письмо на самом деле спам, в котором был анимированный значок (gif) в его теме:

enter image description here

вот только значок:

enter image description here

так что единственное, что пришло мне на ум, было все о данных URIs и если Gmail позволяет вставлять какие-то смайлики в тему. Я видел все. подробная версия электронной почты и указал на строку темы на рисунке ниже:

enter image description here

Итак, GIF происходит от =?UTF-8?B?876Urg==?= закодированная строка, которая похожа на схему URI данных, однако я не мог получить значок из нее. Вот элемент HTML source:

enter image description here

короче говоря, есть много смайликов от https://mail.google.com/mail/e/XXX здесь XXX - это шестнадцатеричные цифры. Они нигде не задокументированы, или я не смог их найти. Если это касается URI данных, поэтому как можно включить их в тему электронной почты Gmail? (Я отправил это письмо на учетную запись электронной почты yahoo, увидев [?] вместо значка), а если нет, то как эта закодированная строка анализируется?

3 ответов


краткое описание:

они называются внутренне как goomoji, и они кажутся нестандартным расширением UTF-8. Когда Gmail встречает один из этих символов, он заменяется соответствующим значком. Я не смог найти никакой документации по ним, но я смог перепроектировать формат.


что это за значки?

эти значки на самом деле являются значками, которые появляются под " вставить смайлики" панель.

Gmail Insert Emoticons

пока я не вижу 52E значок в списке есть несколько других, которые следуют тому же соглашению.

обратите внимание, что есть также некоторые значки, имена которых имеют префиксы, такие как gtalk.03C gtalk.03C. Я не смог определить, могут ли или как эти значки используйте таким образом.


что это за данные URI?

на самом деле это не данные URI, хотя у него есть некоторые сходства. На самом деле это специальный синтаксис для кодирования символов, отличных от ASCII, в темах электронной почты, определенных в RFC 2047. В принципе, это работает так.

=?charset?encoding?data?=

Итак, в нашей строке примера у нас есть следующие данные.

=?UTF-8?B?876Urg==?=
  • charset = UTF-8
  • encoding = B (означает base64)
  • data = 876Urg==


Итак, как это работает?

мы это как-то знаем, 876Urg== означает значок 52E, но как?

если мы base64 декодировать 876Urg==, мы получим 0xf3be94ae. Это выглядит следующим образом в двоичном виде:

11110011 10111110 10010100 10101110

эти биты соответствуют 4-байтовому кодированию UTF-8 характер.

11110xxx 10xxxxxx 10xxxxxx 10xxxxxx

таким образом, соответствующие биты являются следующими.:

     011   111110   010100   101110

или при выравнивании:

00001111 11100101 00101110

в шестнадцатеричном формате эти байты следующие:

FE52E

как вы можете видеть, за исключением FE префикс, который предположительно отличала goomoji значки из других символов UTF-8, он соответствует 52E в URL значка. Некоторые тесты доказывают, что это справедливо для других иконы.


звучит как много работы, есть конвертер?:

это, конечно, может быть по сценарию. Я создал следующий код Python для моего тестирования. Эти функции могут преобразовывать кодированную строку base64 в короткую шестнадцатеричную строку, найденную в URL-адресе, и из нее. Обратите внимание, что этот код написан для 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


Если вы используете правильную шестнадцатеричную кодовую точку (например,fe4f4 для "кучи какашек") и если он правильно закодирован в заголовке строки темы, пусть это будет base64 (см. @AlexanderOMara) или quoted-printable (=?utf-8?Q?=F3=BE=93=B4?=), затем Gmail автоматически проанализирует и заменит его соответствующим emoji.

вот список смайликов Gmail для копирования и вставки в тематические строки - или тела электронной почты. Анимированные смайлики, которые привлекут еще больше внимания во входящих, размещены на желтом фоне:

Gmail emojis on emailmarketingtipps.de


большое спасибо Александр О'Мара для такого хорошо изученного ответа о goomoji-помеченных HTML-изображениях!

Я просто хотел добавить три вещи:

  • есть еще много много emoji (и других последовательностей Unicode, генерирующих изображения), которые спамеры и другие бывшие маркетологи начинают использовать в строках темы электронной почты и что gmail не преобразует в HTML-изображения. В некоторых браузерах они отображаются жирным и цветным шрифтом, что почти так же плохо, как анимация. Браузеры мог бы также Выберите, чтобы оживить их, но я не знаю, есть ли. Эти последовательности Unicode отображаются браузером как текст Unicode, поэтому точный внешний вид (цвет или нет, анимированный или нет, ...) зависит от того, какую систему рендеринга текста использует браузер. Внешний вид данного Unicode emoji также зависит от любого селекторы вариантов Unicode и модификаторы emoji которые появляются рядом с ним в последовательности кодовых точек Unicode. В отличие от спам emoji на основе изображений, эти последовательности могут быть скопированы и вставлены из браузера и в другие приложения в виде текста Unicode.

  • Я надеюсь, что многие маркетологи, читающие этот вопрос StackOverflow, просто скажут "нет". Это ужасная идея, чтобы включить эти последовательности в ваши темы электронной почты, и это немедленно запятнает вас и ваш бренд как спамеров lowlife. Не стоит "внимания", которое получит ваша электронная почта.

  • конечно, первое вопрос, приходящий на ум каждому: "как мне избавиться от этих вещей?"К счастью, есть этот открытый исходный код Greasemonkey / Tampermonkey / Violentmonkey userscript:

Gmail Тема Линии Emoji Плотва Мотель

этот userscript устраняет оба HTML-изображения (благодаря удивительной работе Александр О'Мара) и чистые типы Юникода.

для последнего типа userscript включает регулярное выражение, предназначенное для захват последовательности Unicode, вероятно, будут злоупотреблять маркетологами. Регулярное выражение выглядит так в ES6 Javascript (userscript переводит это в широко поддерживаемое регулярное выражение pre-ES6 с помощью amazing ES6 Regex Transpiler):

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