記錄--微信小程式,uniapp,H5端發送,顯示emoji表情

這裡給大家分享我在網上總結出來的一些知識，希望對大家有所幫助

小伙伴們，在開發中有沒有遇到過發佈帖子或者實時聊天需要發送到一些emoji表情的。

但是每當我們直接將emoji表情提交到後臺的介面又會報錯，因為字元串的格式不一致導致數據無法添加致資料庫。
那麼作為前端的我們就要將我們要提交的數據，通過如下方法正則獲取所有的emoji表情，將其轉成 base64 。

// 將emoji表情其轉成 base64
utf16toEntities:function(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;
},

這樣我們就可以成功的將emoji表情提交到後臺並加入資料庫中了
那麼怎麼顯示的時候是一串字元串呢？
那是因為你這裡沒有在轉一下字元串類型導致現在顯示出來的不是emoji表情，而是一串字元串
接著我們就要在顯示前使用如下方法將該欄位解碼

// 解碼emoji表情
uncodeUtf16:function(str){
	var reg = /\&#.*?;/g;
	var result = str.replace(reg, function (char) {
		var H, L, code;
		if (char.length == 9) {
			code = parseInt(char.match(/[0-9]+/g));
			H = Math.floor((code - 0x10000) / 0x400) + 0xD800;
			L = (code - 0x10000) % 0x400 + 0xDC00;
			return unescape("%u" + H.toString(16) + "%u" + L.toString(16));
		} else {
			return char;
		}
	});
	return result;
},

本文轉載於:

https://blog.csdn.net/XujiRe/article/details/123186801

如果對您有所幫助，歡迎您點個關註，我會定時更新技術文檔，大家一起討論學習，一起進步。