记录–微信小程序,uniapp,H5端发送,显示emoji表情

  • 记录–微信小程序,uniapp,H5端发送,显示emoji表情已关闭评论
  • 140 次浏览
  • A+
所属分类:Web前端
摘要

小伙伴们,在开发中有没有遇到过发布帖子或者实时聊天需要发送到一些emoji表情的。


这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助

记录--微信小程序,uniapp,H5端发送,显示emoji表情

小伙伴们,在开发中有没有遇到过发布帖子或者实时聊天需要发送到一些emoji表情的。

 记录--微信小程序,uniapp,H5端发送,显示emoji表情

记录--微信小程序,uniapp,H5端发送,显示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

如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

 记录--微信小程序,uniapp,H5端发送,显示emoji表情