TinyMCE富文本以及在MySQL 的存储详解

---

前言

今天公司一个老项目需要集成富文本进去，前端框架使用的是layui,经过一番考虑之后，我决定选择TinyMCE这款富文本工具

一、TinyMCE是什么？

TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器，由JavaScript写成。它对IE6+和Firefox1.5+都有着非常良好的支持。

二、使用步骤

英文文档：https://www.tiny.cloud/docs/general-configuration-guide/basic-setup/

中文文档：http://tinymce.ax-z.cn/

三、Mysql存储问题

MySQL支持android和ios表情，需要做一些特别处理。
普通的字符串或者表情都是占位3个字节，所以utf8足够了，但是移动端的表情符号占位是4个字节，普通的utf8就不够用了。

一、utf8mb4方案

数据库采用utf8mb4字符集。

首先，修改数据库的字符集utf8mb4，修改 my.cnf。

[client]

default-character-set = utf8mb4

[mysql]

default-character-set = utf8mb4

[mysqld]

character-set-client-handshake = FALSE

character-set-server = utf8mb4

collation-server = utf8mb4_unicode_ci

init_connect='SET NAMES utf8mb4'

然后，重启 MySQL Server
最后，修改表字段字符集为utf8mb4

ALTER TABLE APP_COMMENT MODIFY `CONTENT` TEXT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci COMMENT '评论内容';

此时，MySQL已经支持表情存储了。

二、Blob的二进制存储方案

上面的方案是一种不错的选择，但是目前我们生产环境采用多租户的方式，不能因为我们的产品需要支持表情存储，就让运维人员去修改数据库配置呀，这样具有很高的运维成本，同时可能影响到其他正在使用的产品，具有一定的风险性。

因此，我们衍生出了第二种解决方案 : 采用blob作为字段类型，通过二进制存储方案。这种方案对现有的产品影响最小， 新增 和 更新 的时候，不需要特别处理，在 查询 的时候，将其进行转码即可。

首先，定义blob类型。

COMMENT blob NOT NULL COMMENT ‘评论内容’

在查询的时候，通过java进行转码

我们，先通过Spring JDBC获取Blob对象。

Blob bContent = rs.getBlob("content");

接着，进行最核心的操作，转码，这样就可以保证二进制内容序列化成utf-8编码的字符串了。

appComment.setContent(new String(bContent.getBytes(1, (int) bContent.length()), "utf-8"));

这样，就能保证MySQL支持表情数据。