4字節emoji表情對應的Unicode編碼獲取和編碼轉換

GitHub Flavored Markdown

今天研究了一天Markdown移動端和pc端統一實現方式,因爲之前有搞過移動端富文本編輯器,搞Markdown簡單多了;
其中GFM的表情語法不錯,好比笑臉😄,準備採用一下。前端

又想到了手機輸入法輸入表情瀏覽器頁面接收到的是一個字符,若是能轉換成😄就更能統一表現了,就像微信Android怎麼輸入輸入法裏面奇醜的emoji到了微信裏面都是微信自帶的好看的emoji圖標,其實這個轉換好幾年前就有開始瞭解,不過沒有什麼進展。git

編碼問題

前幾天恰好有需求要把emoji對應的Unicode編碼轉換成文字,好比1f601對應的這個笑臉😁,但沒有找到C#的把1f601轉換成文字的方法,用Encoding.Unicode怎麼轉換都不對,最後直接複製emoji字符,Visual Studio裏面居然直接顯示出來了,那就直接用字符吧,都不用轉換了,而後不了了之了。github

今天搞Markdown編輯器,因爲前面GFM的緣由,又對編碼進行測試,沒查到什麼靠譜資料,到時找到不少emoji和Unicode對照表,https://apps.timwhitlock.info/emoji/tables/unicode拿一個笑臉https://apps.timwhitlock.info/unicode/inspect/hex/1F601開刀~後端

正確姿式

【C#】 Encoding.UTF32.GetBytes("😁") -> ["1", "f6", "1", "0"]
【js】 "😁".codePointAt(0).toString(16) -> 1f601
UTF-32結果一致瀏覽器

【C#】 Encoding.UTF8.GetBytes("😁") -> ["f0", "9f", "98", "81"]
【js】 encodeURIComponent("😁") -> %F0%9F%98%81
UTF-8結果一致微信

錯誤姿式

【C#】 Encoding.Unicode.GetBytes("😁") -> ["3d", "d8", "1", "de"]
【js】 "😁".codePointAt(0).toString(16) -> 1f601
這個Unicode反而不一致了markdown

其實前段時間一直轉換不對,就是錯怪Encoding.Unicode了,C#裏面Encoding.Unicode=Little-Endian UTF-16app

沒錯是UTF-16,四字節編碼老實用UTF-32就和瀏覽器結果一致了。編輯器

好開森,記錄嘚瑟一下

Java是否是這樣就搞不清楚了,電腦內存小了點就不開Eclipse敲代碼了。測試

有了正確的轉換關係,無論前端對用戶輸入進行替換仍是後端替換都能實現了。下一步製做GFM emoji名字和Unicode編碼對照表,挑幾十個emoji放到編輯器菜單,剩餘的只提供圖片。

關鍵是素材GitHub提供了https://github.com/WebpageFX/emoji-cheat-sheet.com/tree/master/public/graphics/emojis,清晰度還不錯,手機上三倍縮放應該挺清晰,直接拿來用

相關文章
相關標籤/搜索