emoji表情初探

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有好多版本在流行, 這些工具也支持不一樣版本的編碼進行轉換,其原理就是生成每一個版本之間的對應關係, 以下圖