本帖将聚合一些跟emoji表情有关的知识；前端传过来的昵称和备注信息一定要经过严格的正则表达式过滤，放置出现XSS等攻击，另外emoji字体表情库应该使用base64_encode编码，拿信息的时候base64_decode解码即可。
相关文章：“i爱记账” 小程序后端开发小结
相关组件：
wxParse：集成了emoji表情组件；
WxEmojiView-微信小程序Emoji展示输入组件
纯微信小程序 emoji解析组件
**相关demo： **
小程序学习用demo推荐：雨碎江南；emoji，评论(适用1221)
**相关讨论1： **小程序Emoj解析 现在在采用Emoj这套组件开发 改装后台返回的表情数据 遇到个问题就是 循环出来的数据始终是一样的 不知道还需要从哪儿修改.请大神指点
var WxEmoji = require('../../WxEmojiView/WxEmojiView.js');
var list = [{
microblog_id: "274", //主微博ID
sendUserInfo:{
content: "数据1 ~![01][02]"
}
},{
microblog_id: "274",
sendUserInfo:{
content: "数据2 ~![03][04]"
}
},{
microblog_id: "274",
sendUserInfo:{
content: "数据3~![05][06]"
}
}];
//先将中括号替换为可解析的::
for(var i = 0;i<list.length;i++){
var dt = list;
var str = dt.sendUserInfo.content;
// var str2 = str.replace(/[\[\]]/g,':');
var str2 = str.replace(/\[([^\[\]]+)\]/g,':$1:');
dt.sendUserInfo.content = str2;
}
Page({
data:{
list:""
},
onLoad: function(){
var that = this;
WxEmoji.bindThis(this);
for(var i = 0;i<list.length;i++){
WxEmoji.buildTextObjs(that,list.sendUserInfo.content);//使用生成文字
list.sendUserInfo.content = "";//清空默认的原文字
}
that.setData({
list:list
});
},
})
//模板文件循环
<block wx:for="{{list}}">
<view class="msg">
<view class="ty flex-1">
<view class="user_name">
张三
<text class="user_sex_level_male">21</text>
<text class="time">刚刚</text>
</view>
<view class="user_apartment">
天通北苑店
</view>
</view>
<view class="ty user_msg mt0">
<import src="../../WxEmojiView/WxEmojiView.wxml"/>
<template is="WxEmojiView" data="{{WxEmojiObjs}}"/>
</view>
</view>
</block>
回答者：Di 目前WxEmojiView我一直没有更新，目前处于alpha0.1版本，所以不建议直接使用。
比较好的方案是，你从WxEmojiView的处理过程中借鉴并改造在你的小程序中，既然已经使用，那么问题定位 这个问题是因为我当时并没有考虑多行使用的方案，所以我当时暴漏的时候没有暴漏出相关多数据方法
WxEmoji.buildTextObjs(that,list.sendUserInfo.content);//使用生成文字
wxEmojiView的源码中我只做了但数据处理，所以只会显示最后一条数据，而且都是一样的
function buildTextObjs(e,str){
var temObjs = {};
temObjs.WxEmojiTextArray = transEmojiStr(str);
__this.setData({
WxEmojiObjs:temObjs//这里直接返回了一个WxEmojiObjs
});
}
解决方案 改造方法,是建立在你不是用其他功能的基础上
//1.改造方法buildTextObjs
function buildTextObjs(e,str){
var temObjs = {};
temObjs.WxEmojiTextArray = transEmojiStr(str);
return temObjs;
}
//2.使用方法
Page({
data:{
list:""
},
onLoad: function(){
var that = this;
WxEmoji.bindThis(this);
for(var i = 0;i<list.length;i++){
//改造这里
list.sendUserInfo.content = WxEmoji.buildTextObjs(that,list.sendUserInfo.content);
}
that.setData({
list:list
});
},
//3: 模版使用
<block wx:for="{{list}}">
<view class="msg">
<view class="ty flex-1">
<view class="user_name">
张三
<text class="user_sex_level_male">21</text>
<text class="time">刚刚</text>
</view>
<view class="user_apartment">
天通北苑店
</view>
</view>
<view class="ty user_msg mt0">
<import src="../../WxEmojiView/WxEmojiView.wxml"/>
<template is="WxEmojiView" data="{{WxEmojiObjs:item.sendUserInfo.content}}"/>
</view>
</view>
</block>
相关讨论2：带图片的微信昵称存数据库乱码或存不进去的解决办法（作者：刘冰华）很多用户的昵称都带有小图标
如果将emoji表情直接存入utf8编码的数据库，会报错，存不进去。因为编码方式不同
解决方法：
存之前base64_encode()，取的时候base64_decode()
顺道提醒：
存用户昵称时要考虑表情图片这个因素，不一定===字符串字段编码设置为utf8mb4之后，并没有什么用，读取显示的时候都是一堆问号；
相关讨论3：微信小程序无法发送的emoji表情在做一个聊天小程序，发言的时候需要发送输入法中的emoji表情，但是在后端接收的时候收到的确实空字符串。不知道大家遇到过这样的问题吗？
需要从网上找一个js把emoji转换成指定文字的库然后从显示端再转换回来,这样的话服务端需要做处理吗？另外有什么好的js库可以提供吗？ 这样的话服务端可以不用处理了，因为编码和反编码都在前端进行了，库github找找，我也没用过，也是提供一个思路，不过我觉得一定是有这样的库的。
相关讨论4： 我想请问一下各位在开发小程序的时候有遇到过获取nickName昵称时遇到有emoji表情时，存到数据库emoji表情就变成了“？？？”这样的情况吗？ 可以这个编码，后台识别编码找表情.
解决方法：有个办法可以解决，把数据格式blob类型储存
我用个简单方式解决你问题吧
1、String 转 Blob: String content = "Hello World!"; Blob blob = Hibernate.createBlob(content.getBytes());
2、Blob 转 String: Blob blob; try{ String content = new String(blob.getBytes((long)1, (int)blob.length())); } catch(SQLException e) { e.printStackTrace(); }
，就变成那样了，不知道怎么把他搞出来；如果我不存进数据库，就是先用json_encode然后马上用json_decode，返回微信显示是正常的；但是存到数据库之后拿出来json_decode也是有问题，就转不回去了先用urlencode下，取出的时候用urldecode
这个可以，我刚才试了，base64_encode这个函数其实也是可以，这两个其实会不会有什么兼容问题？ 不会存在兼容问题，php高版本也支持
网友评论