2015年12月28日 14:24:51 星期一
首先注意的地方:
1. emoji是需要操作系统支持的, 例如: ios更新时, 会在升级日志里说明, 增加了对多少个emoji图标的支持. 原理上是os维护一张表, 当遇到这些unicode十六进制串的时候, 去表里找对应的图片来渲染
2. 同样的"笑脸"表情, 在不同的系统下的图形是不一样的, 有Unicode官方(原生)的, web端有一套(黑白的), Android, ios, 还有一些开源的, 但是, 同一个意思的表情的Unicode编码是一样
图注: Unicode官方列表
从图中看出:
同一编码(或表达同一个意思的表情)在各个平台的渲染图形是不一样的
code列是unicode编码标准, brow.是浏览器的渲染形状, apple是ios的渲染形状, 还有Google的, One是一个开源的方案, 后边还有twitter, Gmail....
有些表格里是missing, 说明这个平台对这种表情还不支持
mysql存储:
注意:
1. utf8mb4, 是最大支持四个字节的utf8字符集, 是utf8的超集, 所以升级utf8到utf8mb4不会对原有字段截断, 没有影响
2. utf8mb4中的mb跟PHP的mb_**函数们是一个意思, multi Byte 多字节的意思
3. 存储或查询的时候, 表以及相应字段修改为utf8mb4, 不用修改mysql配置文件(备份的时候要指定字符集,mysqldump --default-charater-set=utf8mb4)
mysql> show create table emoji \G *************************** 1. row *************************** Table: emoji Create Table: CREATE TABLE `emoji` ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT, `content` varchar(50) DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=8 DEFAULT CHARSET=utf8mb4
mysql> show full columns from emoji; +---------+------------------+--------------------+------+-----+---------+----------------+---------------------------------+---------+ | Field | Type | Collation | Null | Key | Default | Extra | Privileges | Comment | +---------+------------------+--------------------+------+-----+---------+----------------+---------------------------------+---------+ | id | int(10) unsigned | NULL | NO | PRI | NULL | auto_increment | select,insert,update,references | | | content | varchar(50) | utf8mb4_general_ci | YES | | NULL | | select,insert,update,references | | +---------+------------------+--------------------+------+-----+---------+----------------+---------------------------------+---------+
图注: 表字符集的配置(charset utf8mb4, collate utf8mb4_general_ci)
4. 连接数据库查询前设置连接字符集 set names utf8mb4 (下边通过对一个Android小程序的调试来解释)
5. 直接在命令行查看数据, 表情符号会是一个问号(?), 但实际上在安卓中可以正常显示的, 因为我这个linux不支持, 而Android系统支持,
(mysql select 出来有4个问号说明插入错误, 注意insert时set names utf8mb4, select 出来有一个问号, 说明select时没有set names utf8mb4)
下边是几个平台的截图:
=>
=>
当然浏览器显示的表情比较简陋, 可以通过一些工具对其进行"美化", 比如 js-emoji, php-emoji
美化的原理是
1. 事先制作一张包含所有emoji表情的图片
2. 然后将编码与图片偏移量的对应关系写到数组里边
3. 最后将输入的字符串中包含的emoji编码替换成对应的图片或<img>标签
因为在成为标准之前, emoji有好多版本在流行, 这些工具也支持不同版本的编码进行转换,其原理就是生成每个版本之间的对应关系, 如下图
