Ранее я уже писал об Информере Вконтакте — браузерном расширении для быстрого прочтения и ответа на сообщение. В процессе создания столкнулся с проблемой — смайлы в сообщениях, а именно: как их отобразить?
Дело в том, что при получении текста сообщения методами API Вконтакте смайлы в нем вставлены спец. символами:

response: {
  count: 1,
  items: [{
    id: 370892,
    body: 'Hello World 😊',
    user_id: 45421694,
    from_id: 45421694,
    date: 1437721570,
    read_state: 1,
    out: 0,
    emoji: 1
  }]
}

Возник вопрос: как же заменить все спец. символы на соответствующие изображения?

Решение нашлось в самом Вконтакте — Скрипт которым сам ВК парсит смайлы.

Однако, как видно, в нем очень уж много всего: здесь и события для загрузки смайлов, и открытие окна стикеров, и покупка нового стикера и т.д. Поэтому привожу ссылку на изменённый код Emoji.js

Использование

Использовать данный скрипт достаточно просто.

Emoji.emojiToHTML( 'Hello World 😊' ); // 'Hello World <img class="emoji" alt="😊" src="https://vk.com/images/emoji/D83DDE0A.png">'

Как видите, по умолчанию скрипт вставляет изображения с сервера Вконтакте, что означает, что вам не нужно закружать все картинки в свой проект. Однако, вы можете изменить путь к картинкам:

Emoji.pathToEmojisImages = '/path/to/img/'; // Обратите внимание на закрывающий слеш
Emoji.emojiToHTML( 'Hello World 😊' ); // 'Hello World <img class="emoji" alt="😊" src="/path/to/img/D83DDE0A.png">'

Таким образом можно легко использовать смайлы в сообщениях полученных через API Вконтакте.