微信昵称不完全显示解决方案

微信昵称的emoji来源有2个,一个是softbank类型的,一个是识别完整的Unicode类型。
比如 猪头表情,微信回传的utf8编码为EE 84 8B,转为code码为57611,16进制的话就是E10B,刚好是softbank的E10B的表情。E10B在Unicode编码里面属于私有部分(E000-F8FF),直接在html会显示框框
然后圆形月亮脸的表情,微信回传的utf8编码为F0 9F 8C 9D,这个是直接在Unicode编码表上列出的。
所以即便使用正确的数据库类型(mysql的utf8mb4)将微信昵称完整的保存下来,最后输出到网页上,也不一定能显示完全,能显示的只有unicode编码表上的那一部分,softbank所属表情无法显示。为了解决这个问题,需要将softbank所属表情编码给转换成unicode对应的表情编码,可以使用emoji.js这个库进行转换。
代码很简单,引入emoji.js库之后:

1
htmlText = jEmoji.softbankToUnified(nickname)

即可显示。不过这个显示出来的表情,可能和手机原有表情长相不太一致,html版本和app版差距较大,但好歹能显示了。


emoji.js库还有一种做法,可以将html版表情通过css和对应图片转换为app版,代码也简单,在原有基础上包一层即可。

1
html = jEmoji.unifiedToHTML(jEmoji.softbankToUnified(nickname))

注意这里输出的是html代码,需要用innerHtml的办法在网页上显示。

参考链接:
unicode表
emoji转换js

商务洽谈