微信小程序输入框输入表情，Navicat for MySQL数据库存取emoji

MySQL存取emoji表情

问题介绍

微信小程序实现用户评论文章功能，考虑到评论中包含emoji表情，尝试直接存入数据库，失败。

原因

Emoji表情符号为4个字节的字符，而 utf8 字符集只支持1-3个字节的字符，导致无法写入数据库。

解决问题

方法1 修改字符集

修改MySQL数据库字符集， 把数据库字符集从utf8 修改为支持1-4 个字节字符的utf8mb4。
从MySQL 5.5.3版本开始，数据库可支持4个字节的utf8mb4 字符集，一个字符最多可以有4个字节，所以能支持更多的字符集，故能存储Emoji表情符号。

我们开发用的是数据库管理工具Navicat，管理MySQL数据库。具体解决方式见这里。

方法2 编解码

查找解决方法的时候，发现有通过编码解决的。
思路就是，存入数据库前进行编码，从数据库查数据的时候再进行解码。好像有点麻烦，但总算能解决问题。不过用这种方法存在问题，数据库里存的都是编码后的数据，看不懂。

//  Base64.js
/*
  *  UTF-16转UTF-8
  *  @parm : str 传入的字符串
  */
function utf16to8(str) {
  var out, i, len, c;
  out = "";
  len = str.length;
  for (i = 0; i < len; i++) {
    c = str.charCodeAt(i);
    if ((c >= 0x0001) && (c <= 0x007F)) {
      out += str.charAt(i);
    } else if (c > 0x07FF) {
      out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
      out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
      out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
    } else {
      out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
      out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
    }
  }
  return out;
}

/*  
  *  base64编码
  *  @parm : str 传入的字符串
  *  使用：
        1、引入Base64.js(路径更改) :const Base64  = require('../../utils/Base64.js');
        2、Base64.base64_encode(util.utf16to8('base64 编码'));
 */
function base64_encode(str) {
  //下面是64个基本的编码
  var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
  var out, i, len;
  var c1, c2, c3;
  len = str.length;
  i = 0;
  out = "";
  while (i < len) {
    c1 = str.charCodeAt(i++) & 0xff;
    if (i == len) {
      out += base64EncodeChars.charAt(c1 >> 2);
      out += base64EncodeChars.charAt((c1 & 0x3) << 4);
      out += "==";
      break;
    }
    c2 = str.charCodeAt(i++);
    if (i == len) {
      out += base64EncodeChars.charAt(c1 >> 2);
      out += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
      out += base64EncodeChars.charAt((c2 & 0xF) << 2);
      out += "=";
      break;
    }
    c3 = str.charCodeAt(i++);
    out += base64EncodeChars.charAt(c1 >> 2);
    out += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
    out += base64EncodeChars.charAt(((c2 & 0xF) << 2) | ((c3 & 0xC0) >> 6));
    out += base64EncodeChars.charAt(c3 & 0x3F);
  }
  return out;
}

/*
  *  utf-8解码
  *  @parm : utftext 传入的字符串
  */
function utf8_decode(utftext) {
  var string = '';
  let i = 0;
  let c = 0;
  let c1 = 0;
  let c2 = 0;
  while (i < utftext.length) {
    c = utftext.charCodeAt(i);
    if (c < 128) {
      string += String.fromCharCode(c);
      i++;
    } else if ((c > 191) && (c < 224)) {
      c1 = utftext.charCodeAt(i + 1);
      string += String.fromCharCode(((c & 31) << 6) | (c1 & 63));
      i += 2;
    } else {
      c1 = utftext.charCodeAt(i + 1);
      c2 = utftext.charCodeAt(i + 2);
      string += String.fromCharCode(((c & 15) << 12) | ((c1 & 63) << 6) | (c2 & 63));
      i += 3;
    }
  }
  return string;
}


/*
  *  base64解码
  *  @parm : input 传入的字符串
  *  使用：
        1、引入Base64.js(路径更改) :const Base64  = require('../../utils/Base64.js');
        2、Base64.base64_decode('YmFzZTY0IOe8lueggQ==');
 */
function base64_decode(input) {
  var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
  var output = "";
  var chr1, chr2, chr3;
  var enc1, enc2, enc3, enc4;
  var i = 0;
  input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
  while (i < input.length) {
    enc1 = base64EncodeChars.indexOf(input.charAt(i++));
    enc2 = base64EncodeChars.indexOf(input.charAt(i++));
    enc3 = base64EncodeChars.indexOf(input.charAt(i++));
    enc4 = base64EncodeChars.indexOf(input.charAt(i++));
    chr1 = (enc1 << 2) | (enc2 >> 4);
    chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
    chr3 = ((enc3 & 3) << 6) | enc4;
    output = output + String.fromCharCode(chr1);
    if (enc3 != 64) {
      output = output + String.fromCharCode(chr2);
    }
    if (enc4 != 64) {
      output = output + String.fromCharCode(chr3);
    }
  }
  return utf8_decode(output);
}

/*
  * base64编码函数封装
  * @parm: str(传入要编成base64的内容)
  * 使用：
      1、引入Base64.js(路径更改) :const util  = require('../../utils/Base64.js');
      2、Base64.base64Encode('base64 编码');
  */
function base64Encode(str) {
  return base64_encode(utf16to8(str));
}

/*
  * base64解码函数封装
  * @parm: str(传入要解为正常字体)
  * 使用：
      1、引入Base64.js(路径更改) :const util  = require('../../utils/Base64.js');
      2、Base64.base64Decode(Base64.base64Encode('base64 编码'))
  */
function base64Decode(str) {
  return base64_decode(str);
}

// 抛出函数使用
module.exports = {
  base64Encode: base64Encode,
  base64Decode: base64Decode
}

调用
js文件

const Base64 = require('../../../../utils/Base64.js')

Base64.base64Encode('需编码的内容');	//编码
Base64.base64Decode('编码内容')  //解码

效果

---

链接

1. 方法1改MySQL字符集
2. Base64编解码