记录--微信小程序,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

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

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

记录一次微信小程序进行长连接通信使用emoji表情
前言起因是工作中微信小程序要做一个实时聊天功能并且可以发表情,在微信官方文档中其实是有emoji扩展组件的,用法也大概说明:自己看了一下文档. 之后自己理了理思路,摸索着自己写一个. 正文 Emoj ...
【微信小程序】微信小程序开发--用户昵称中带有emoji表情的处理方法
刚开始写小程序,获取客户昵称,后来发现用户昵称是可以为emoji表情的,而Mysql数据库中是不支持直接将emoji表情直接存入数据库的,后来在网站上找了一个方法将所有的昵称转变为Unicode编码存 ...
微信小程序-如何实现input框输入emoji表情？【亲测有效】
uniapp兼容保利威视频，可编译成微信小程序、移动端、h5
基于uniapp开发,引入保利威视频云, 代码可编译成微信小程序,移动端,h5,其他小程序理论上都支持但是没有验证,demo下载地址 https://download.csdn.net/downloa ...
uni-app开发微信小程序，H5 关于压缩上传图片的问题
文章目录前言一.为什么要压缩图片二.图片压缩方式 1. 微信小程序 2. H5 总结前言关于微信小程序.H5兼容性问题,今天就压缩以及上传图片做一个可实现方法的简要阐述. 一. ...
Shopro商城高级版 Fastadmin和Uniapp进行开发的多平台商城（微信公众号、微信小程序、H5网页、Android-App、IOS-App）
Shopro商城无加密的开源源码(可用于自营+外包项目(多主体).可用于外包定制开发项目) shopro 商城,一款基于 uni-app 的前端模板商城.目前适配了(小程序+app+h5+公众号). ...
Shopro商城,基于Fastadmin和Uniapp进行开发的多平台（微信公众号、微信小程序、H5网页、Android-App、IOS-App）购物商城
Shopro商城基于Fastadmin和Uniapp进行开发的多平台(微信公众号.微信小程序.H5网页.Android-App.IOS-App)购物商城,拥有强大的店铺装修.小程序直播.自定义模板. ...
json 微信小程序筛选_GitHub - zhengyangkang/sl-filter: uni -app 一款使用简单的筛选组件，适配app、微信小程序、H5。...
sl-filter 筛选筛选组件,组件名:sl-filter dcloud插件市场地址 sl-filter 简介一款使用简单的筛选组件,适配app.微信小程序.H5. 感谢分享效果图并列菜单 ...
java webpack web项目_官方出品，微信小程序和 Web 端同构解决方案——kbone
介绍最近在琢磨一些小程序开发和移动web开发,偶然间在Github上看到了这样一个项目--kbone,一个致力于微信小程序和 Web 端同构的解决方案.微信小程序的底层模型和 Web 端不同,我们想 ...