emoji表情進行編碼以適配移動端用戶emoji表情的輸入和展示


功能介紹:用戶輸入emoji表情,如輸入法里的附帶的表情,然后前端這里編碼這些表情成特定格式的字符,傳到后端。之后從接口拿到后直接html渲染即可。

問題所在:移動端用戶輸入emoji表情,如果未做編碼就提交到后端的話,是不能成功提交的。需要先編碼才行。

編碼

/**
 * 用於把用utf16編碼的字符轉換成實體字符,以供后台存儲
 * @param  {string} str 將要轉換的字符串,其中含有utf16字符將被自動檢出
 * @return {string}     轉換后的字符串,utf16字符將被轉換成&#xxxx;形式的實體字符
 */
function transEmoji(str) {
    var patt=/[\ud800-\udbff][\udc00-\udfff]/g; // 檢測utf16字符正則
    str = str.replace(patt, function(char){
            var H, L, code;
            if (char.length===2) {
                H = char.charCodeAt(0); // 取出高位
                L = char.charCodeAt(1); // 取出低位
                code = (H - 0xD800) * 0x400 + 0x10000 + L - 0xDC00; // 轉換算法
                return "&#" + code + ";";
            } else {
                return char;
            }
        });
    return str;
}

拿到數據后渲染

正確渲染:直接以html形式渲染  <div v-html="content"></div>
錯誤方式:渲染不出來 <div>{{content}}</div>

以上內容轉至大佬博客,建議去看看原理: https://blog.csdn.net/binjly/article/details/47321043


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM