ti-enxame.com

Ícone animado no assunto do email

Eu sei sobre Data URI s em que base64 dados codificados podem ser usados ​​em linha, como imagens. Hoje recebi um email na verdade um spam no qual havia um ícone animado (gif) em seu assunto:

enter image description here

Aqui está o ícone sozinho:

enter image description here

Então, a única coisa que passou pela minha mente foi sobre os URIs de dados e se o Gmail permite que algum tipo de emoticon seja inserido no assunto. Eu vi a versão completa detalhada do email e apontei para a linha de assunto na imagem abaixo:

enter image description here

Então, o GIF vem da string codificada =?UTF-8?B?876Urg==?=, que é semelhante ao esquema Data URI, mas não consegui tirar o ícone dele. Aqui está a fonte do elemento HTML:

enter image description here

Para encurtar a história, há muitos emoticons de https://mail.google.com/mail/e/XXX onde XXX são números hexadecimais. Eles estão documentados em nenhum lugar ou eu não consegui encontrá-lo. Se for sobre o URI de dados, como é possível incluí-los no assunto do e-mail do Gmail? (Eu encaminhei esse e-mail para uma conta de e-mail do yahoo, vendo [?] em vez de ícone) e, se não, então como essa string codificada é analisada?

100
revo

Pequena descrição:

Eles são referidos internamente como goomoji e parecem ser uma extensão UTF-8 não padrão. Quando o Gmail encontra um desses caracteres, ele é substituído pelo ícone correspondente. Não consegui encontrar nenhuma documentação sobre eles, mas consegui fazer a engenharia reversa do formato.


Quais são esses ícones?

Esses ícones são, na verdade, os ícones exibidos no painel "Inserir emoticons".

Gmail Insert Emoticons

Embora eu não veja o ícone 52E na lista, há vários outros que seguem a mesma convenção.

Observe que também há alguns ícones cujos nomes são prefixados, como gtalk.03C gtalk.03C. Não consegui determinar se ou como esses ícones podem ser usados ​​dessa maneira.


O que é essa coisa de URI de dados?

Não é realmente um Data URI , embora compartilhe algumas semelhanças. Na verdade, é uma sintaxe especial para codificar caracteres não-ASCII em assuntos de email, definidos em RFC 2047 . Basicamente, funciona assim.

=?charset?encoding?data?=

Então, em nossa string de exemplo, temos os seguintes dados.

=?UTF-8?B?876Urg==?=
  • charset = UTF-8
  • encoding = B (significa base64)
  • data = 876Urg==


Então, como isso funciona?

Sabemos que, de alguma forma, 876Urg== significa o ícone 52E, mas como?

Se nós baseamos 64 decodificar 876Urg==, obtemos 0xf3be94ae. Isso parece com o seguinte em binário:

11110011 10111110 10010100 10101110

Esses bits são consistentes com um caractere codificado UTF-8 de 4 bytes.

11110xxx 10xxxxxx 10xxxxxx 10xxxxxx

Portanto, os bits relevantes são os seguintes:

     011   111110   010100   101110

Ou quando alinhado:

00001111 11100101 00101110

Em hexadecimal, esses bytes são os seguintes:

FE52E

Como você pode ver, exceto pelo prefixo FE que supostamente distingue os ícones goomoji de outros caracteres UTF-8, ele corresponde ao 52E no URL do ícone. Alguns testes comprovam que isso vale para outros ícones.


Soa como um monte de trabalho, existe um conversor ?:

Isso pode, claro, ser roteirizado. Eu criei o seguinte código Pythonpara meus testes. Essas funções podem converter a string codificada em base64 para e da cadeia hexadecimal curta encontrada na URL. Note que este código é escrito para Python 3 e não é compatível comPython 2.

Funções de conversão:

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')

Exemplos:

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

Saída:

52E
876Urg==

E, é claro, encontrar o URL de um ícone simplesmente exige a criação de um novo rascunho no Gmail, a inserção do ícone desejado e o uso do inspetor DOM do seu navegador.

DOM Inspector

172
Alexander O'Mara

Se você usar o ponto de código hexadecimal correto (por exemplo, fe4f4 para 'pile of poo' ) e Se ele estiver codificado corretamente no cabeçalho da linha de assunto, seja base64 (consulte @AlexanderOMara) ou quoted-printable (=?utf-8?Q?=F3=BE=93=B4?=), o Gmail analisará automaticamente e substituirá o emoji correspondente.

Aqui está uma lista de emojis do Gmail para copiar e colar em linhas de assunto - ou corpos de e-mail. Os emojis animados, que atraem ainda mais atenção na caixa de entrada, são colocados em um plano de fundo amarelo:

Gmail emojis on emailmarketingtipps.de

18
lukeA

Muito obrigado a Alexander O'Mara por uma resposta tão bem pesquisada sobre as imagens HTML com tags do goomoji!

Eu só queria adicionar três coisas:

  • Ainda há muitos emojis (e outras sequências Unicode gerando imagens) que os spammers e outros profissionais de marketing antigos estão começando a usar em linhas de assunto de email e que o Gmail não converte em imagens HTML. Em alguns navegadores, eles aparecem em negrito e coloridos, o que é quase tão ruim quanto a animação. Os navegadores poderiam também optar por animá-los, mas não sei se algum deles faz isso. Essas seqüências Unicode são exibidas pelo navegador como texto Unicode, portanto a aparência exata (colorida ou não, animada ou não, ...) depende do sistema de renderização de texto que o navegador está usando. A aparência de um determinado emoji Unicode também depende de qualquer seletores de variação Unicode e modificadores emoji que aparecem próximos a ele na sequência de pontos de código Unicode. Ao contrário do spam de emoji baseado em imagem, essas sequências podem ser copiadas e coladas fora do navegador e em outros aplicativos como texto Unicode.

  • Espero que muitos profissionais de marketing que estejam lendo esta questão do StackOverflow apenas digam que não. É uma idéia horrível incluir essas seqüências em suas linhas de assunto de e-mail e isso vai manchar imediatamente você e sua marca como spammers de baixa densidade. Não vale a pena a "atenção" que seu email receberá.

  • É claro que a primeira pergunta que vem à mente de todos é: "como me livrar dessas coisas?" Felizmente há esse userscript Greasemonkey/Tampermonkey/Violentmonkey de código aberto:

Linha de assunto do Gmail Emoji Roach Motel

Este userscript elimina tanto a imagem HTML (graças ao incrível trabalho dos tipos Alexander O'Mara ) e pure-Unicode.

Para o último tipo, o userscript inclui uma expressão regular projetada para capturar as seqüências Unicode prováveis ​​de serem abusadas pelos profissionais de marketing. A regex se parece com isso no Javascript ES6 (o userscript traduz isso para regex pré-ES6 amplamente suportado usando o incrível 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
0
Louis Semprini